In JSF 2.0, you can use <h:outputScript /> tag to render a HTML “script” element, and link it to a js file.

For example,

<h:outputScript library="js" name="common.js" />

It will generate following HTML output…

<script type="text/javascript"

  	src="/JavaServerFaces/faces/javax.faces.resource/common.js?ln=js">

</script>

JSF outputScript example

An example to show you how to use <h:outputScript /> to render a “common.js“, see figure below :

JSF file

``

	<h1>JSF 2 outputScript example</h1>

	<h:outputScript library="js" name="common.js" />

</h:body>

```
It will generate following HTML output
```

 <h1>JSF 2 outputScript example</h1>

 <script type="text/javascript"

   src="/JavaServerFaces/faces/javax.faces.resource/common.js?ln=js">

 </script>

```
The JS file will render in where JSF `` tag is placed.
##Target Attribute

In addition, you can use “target” attribute to control where to output the js file.

  • target=”head” – Display within the top of HTML head tag.
  • target=”body” – Display at the end of the body tag.
  • no target – Display at where the tag is placed.

For example

<h:outputScript library="js" name="common.js" target="body" />

It will generate following HTML output

<?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>

How to include JavaScript file in JSF的更多相关文章

  1. 使用 JavaScript File API 实现文件上传

    概述 以往对于基于浏览器的应用而言,访问本地文件都是一件头疼的事情.虽然伴随着 Web 2.0 应用技术的不断发展,JavaScript 正在扮演越来越重要的角色,但是出于安全性的考虑,JavaScr ...

  2. ResolveUrl in external JavaScript file in asp.net project

    https://stackoverflow.com/questions/11263425/page-resolveurl-is-not-working-in-javascript The proble ...

  3. Inline Workers--Web workers without a separate Javascript file

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> </head&g ...

  4. Minify or format javascript file by web or notepad++

    Notepad++ plugin manager install 'JSTOOL' http://tool.oschina.net/codeformat/js https://www.cnblogs. ...

  5. This seems to be a pre-built javascript file. webpack报这个警告怎么办?

    增加 module.noParse 进行解决 例如: { resolve: { alias: { 'react': 'my/react/path' } }, module: { noParse: [/ ...

  6. dynamic load javascript file.

    $.ajax({ url : ("js/public/" + window.localStorage.getItem("lang") + ".js&q ...

  7. Dynamically loading an external JavaScript or CSS file

    原文:   Dynamically loading an external JavaScript or CSS file 通过javascript动态加载css文件和javascript文件,主要是通 ...

  8. html中#include file的使用方法

    有两个文件a.htm和b.htm,在同一文件夹下a.htm内容例如以下 <!-- #include file="b.htm" --> b.htm内容例如以下 今天:雨 ...

  9. html 中 #include file 的用法

    有两个文件a.htm和b.htm,在同一目录下a.htm内容如下 <!-- #include file="b.htm" --> b.htm内容如下 今天:雨 31 ℃- ...

随机推荐

  1. 面试题_82_to_87_Date、Time 及 Calendar 的面试题

    82)在多线程环境下,SimpleDateFormat 是线程安全的吗?(答案)不是,非常不幸,DateFormat 的所有实现,包括 SimpleDateFormat 都不是线程安全的,因此你不应该 ...

  2. Hibernate4.2.2使用Annotation配置

    1.在hibernate官网下载hibernate-release-4.2.2.Final.zip并解压 2.新建一个java project工程(20130619_Hibernate4.2.2_An ...

  3. bzoj4011

    好题,首先有一个结论,有向无环图的树形图数目=根节点意外入度之积 现在相当于在原图上加一条边问树形图的数目 考虑多出来不合法的方案,一定是成环且包含新加入的边 对于一条路贡献就是∏d[i] [i∉pa ...

  4. ASP.NET线程相关配置

    1.(maxWorkerThreads * CPU逻辑数量)-minFreeThreads 比如2个CPU默认配置maxWorkerThreads=100,minFreeThreads=176,则同时 ...

  5. UVa 11916 (离散对数) Emoogle Grid

    因为题目要求同列相邻两格不同色,所以列与列之间不影响,可以逐列染色. 如果一个格子的上面相邻的格子,已经被染色则染这个格子的时候,共有k-1中选择. 反过来,如果一个格子位于第一列,或者上面相邻的格子 ...

  6. Android Broadcast Receiver

    说明 有时候我们在做android系统软件的时候,经常会需要做的事就是开机重新设置上次关机前的状态,当然,我们就会用到这个开机广播: <uses-permission android:name= ...

  7. ti processor sdk linux am335x evm /bin/setup-package-install.sh hacking

    #!/bin/sh # # ti processor sdk linux am335x evm /bin/setup-package-install.sh hacking # 说明: # 本文主要对T ...

  8. Discuz!NT静态文件缓存(SQUID)

    在目前最新版本的产品中,我们提供了缓存静态文件的解决方案,就是使用SQUID做静态前端,将论坛中的大部分静态文件布署或外链到一个新的HTTP链接上,其中可以外链的静态文件包括:      1.Disc ...

  9. 【转】 UIALertView的基本用法与UIAlertViewDelegate对对话框的事件处理方法

    原文网址:http://blog.csdn.net/enuola/article/details/7900346 首先,视图控制器必须得实现协议UIAlertViewDelegate中的方法,并指定d ...

  10. .NET Remoting

    .NET Remoting   .NET Remoting是微软早期的分布式通信技术,虽然微软后来通过WCF通用基础通信框架整合掉了,但是通过回顾学习Remoting,反过来学习理解WCF也是很有帮助 ...