JSFにJavaScriptファイルを含める方法
JSF 2.0では、 `<h:outputScript/>`タグを使ってHTMLの “script”要素をレンダリングし、それをjsファイルにリンクすることができます。
例えば、
<h:outputScript library="js" name="common.js"/>
それは、次のHTML出力を生成します…
<script type="text/javascript"
src="/JavaServerFaces/faces/javax.faces.resource/common.js?ln=js">
</script>
JSF出力スクリプトの例
<h:outputScript/> 'を使って
`common.js`”をレンダリングする方法を示す例は、下の図を参照してください:
JSFファイル
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
>
<h:head></h:head>
<h:body>
<h1>JSF 2 outputScript example</h1>
<h:outputScript library="js" name="common.js"/>
</h:body>
</html>
次のHTML出力を生成します
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body>
<h1>JSF 2 outputScript example</h1>
<script type="text/javascript"
src="/JavaServerFaces/faces/javax.faces.resource/common.js?ln=js">
</script>
</body>
</html>
JSファイルは、JSFの<h:outputScript/>タグが配置されている場所でレンダリングされます。
ターゲット属性
さらに、 “target”属性を使用して、jsファイルの出力先を制御することもできます。
-
target = “head” – HTMLのheadタグの先頭に表示します.
-
target = “body” – bodyタグの最後に表示します.
-
ターゲットなし – タグの配置場所を表示します.
例えば
<h:outputScript library="js" name="common.js" target="body"/>
次のHTML出力を生成します
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<h1>JSF 2 outputScript example</h1>
<script type="text/javascript"
src="/JavaServerFaces/faces/javax.faces.resource/common.js?ln=js">
</script>
</body>
</html>
ソースコードをダウンロードする
ダウンロードする – リンク://wp-content/uploads/2010/10/JSF-2-outputScript-Example.zip[JSF-2-outputScript-Example.zip]（9KB）
リファレンス
<h:outputScript/> JavaDoc]
