jsf的标签

首先在页面引入，假定前缀是h，即这样声明：<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
按照JSF中的UIComponent来划分：
UIForm
1. h:form
用法：
<h:form id="form1">...</h:form>对应HTML语法：
<form id="form1" method="post"

    action="/.../..**.jsp"

    enctype="application/x-www-form-urlencoded">

    ...

</form>UICommand
1. h:commandButton
用法：
<h:commandButton

   id="btn1"

   value="#{msgs.okButton}"

   action="#{bean.actionMethod}">

</h:commandButton>对应HTML语法：
<input id="form1:btn1"

      type="submit"

      name="form1:btn1"

      value="ok"/>2.h:commandLink用法：
<h:commandLink id="link" action="enter">

  <h:outputText value="#{msgs.linkName}"/>

</h:commandLink>



对应HTML语法：
<a id="form1:link"

href="#" οnclick=

"document.forms['fomr1']['form1:link'].value=

   'form1:link';

         document.forms['form1'].submit();

        return false;">link name</a>



UIGraphic
?h:graphicImage
用法：
<h:graphicImage id="image"

   alt="label"

   url="/images/***.gif">

</h:graphicImage> 对应HTML语法：
<img id="form1:image"

src="/.../images/***.gif"

  alt="label" />



UIInput
1. h:inputText
用法：
<h:inputText id="name"

  value="#{bean.name}" />



对应HTML语法：
<input type="text" name="form1:name"

  value="terry" />2. h:inputSecret
用法：
<h:inputSecret id="psw" value="#{jsfexample.password}" />



对应HTML语法：
<input id="form1:psw"

   type="password"

   name="form1:psw"

   value="secret" />



3. h:inputHidden
用法：
<h:inputHidden id="hidden"



   value="locale" />



对应HTML语法：
<input id="form1:hidden"

   type="hidden"

   name="form1:hidden"

   value="locale" />



4. h:inputTextArea
用法：
<h:inputTextarea id="area"

   rows="4" cols="7"

   value="Please input the contents here..."/>



对应HTML语法：
<textarea id="form1:area"

   name="form1:area"

   cols="7" rows="4">

    Please input the contents here...</textarea>



UIOutput
1. h:outputText
用法：
<h:outputText

value="#{bean.name}"/>



对应HTML语法：
terry



2. h:outputLabel

用法：
<h:outputLabel for="name">

  <h:outputText id="nameLabel"

    value="member name"/>

</h:outputLabel>



对应HTML语法：
<span id="form1:nameLabel">

  member name</span>3.h:outputLink用法：
<h:outputLink

value="">

  <f:verbatim>JSF China</f:verbatim>

</h:outputLink>



对应HTML语法：
<a href="http://www.jsfchina.org">

JSF Studio

</a>



4. h:outputFormat
用法：
<h:outputFormat

value="#{msgs.welcomeVisit}">

  <f:param value="Joey"/>

  <f:param id="nice"

    value="#{msgs.niceday}"/>

</h:outputFormat>对应HTML语法：
Welcome, Joey, have a nice day!



UIMessage/UIMessages
h:message
用法：
<h:inputText id="nick"

value="#{bean.nickname}"

  required="true"/>

<h:commandButton action="#{bean.activate}" value="activate"/>

<h:message for="nick" />



对应HTML语法：
<input id="form1:nick"

type="text"

  name="form1:nick" value="" />

<input type="submit" name="form1:_id1"

value="activate" />

<span>

Validation Error: Value is required.

</span>

接第一部分
UISelectBoolean
h:selectBooleanCheckbox
用法：
<h:selectBooleanCheckbox

  value="#{bean.newMemberTag}" >

</h:selectBooleanCheckbox>

<h:outputText

  value="New Member?"/>



对应HTML语法：
<input type="checkbox"

  name="form1:_id6" checked

/>

New Member?



UISelectMany
1. h:selectManyCheckboxlist
用法：
<h:selectManyCheckbox id="news"

value="#{carsBean.new}">

  <f:selectItems

   value="#{bean.newsList}"/>

</h:selectManyCheckbox>



对应HTML语法：
<span id="form1:news">

<table>

<tr>

<td><label for="form1:news">

   <input name="form1:news"

     value="ajax" type="checkbox">

    Ajax revolution</input>

   </label></td>

<td><label for="form1:news">

   <input name="form1:news"

     value="spring" type="checkbox">

    Spring Fashion</input>

    </label></td>

</tr>

</table>

</span>



2. h:selectManyMenu
用法：
<h:selectManyMenu

id="new"

  value="#{bean.currentNew}">

   <f:selectItems

    value="#{bean.newsList}"/>

</h:selectManyMenu>



对应HTML语法：
<select id="form1:new"

name="form1:new"

  multiple size="1">

  <option value="ajax">Ajax Revolution</option>

  <option value="spring">Spring</option>

</select>



3. h:selectManyListbox
用法：
<h:selectManyListbox

id="new"

  value="#{bean.currentNew}">

   <f:selectItems

    value="#{bean.newsList}">

</h:selectManyListbox>



对应HTML语法：
<select id="form1:new"

name="form1:new"

  multiple size="2">

   <option value="ajax">Ajax Revolution</option>

   <option value="spring">Spring</option>

</select>UISelectOne
1. h:selectOneRadio
用法：
<h:selectOneRadio id="new"

value="#{bean.currentNew}">

  <f:selectItems

   value="#{bean.newsList}" />

</h:selectOneRadio>



对应HTML语法：
<table><tr>

<td>

  <label for="form1:new">

   <input type="radio"

    name="form1:new" value="ajax">

      Ajax Revolution

     </input></label>

</td>

<td>

  <label for="form1:new">

   <input type="radio"

    name="form1:new" value="spring">

      Spring

     </input></label>

</td>

</tr></table>



2. h:selectOneMenu
用法：
<h:selectOneMenu id="new"

value="#{bean.currentNew}">

  <f:selectItems

   value="#{bean.newsList}" />

</h:selectOneMenu>对应HTML语法：
<select id="form1:new"

name="form1:new" size="1">

  <option value="ajax">Ajax Revolution</option>

  <option value="spring">Spring</option>

</select>



3. h:selectOneListbox
用法：
<h:selectOneListbox id="new"

value="#{bean.currentNew}">

  <f:selectItems

   value="#{bean.newsList}" />

</h:selectOneListbox>



对应HTML语法：
<select id="form1:new"

name="form1:new" size="2">

  <option value="ajax">Ajax Revolution</option>

  <option value="spring">Spring</option>

</select>



UIPanel
h:selectBooleanCheckbox
用法：
<h:panelGrid columns="2" footerClass="footclass"

  headerClass="headclass" styleClass="table_content"

  columnClasses="column1,column2">

  <f:facet name="header">

    <h:outputText value="tale demostration"/>

  </f:facet>

  <h:outputText value="cell1" />

  <h:outputText value="cell2" />

  <h:outputText value="cell3" />

  <h:outputText value="cell4" />

  <f:facet name="footer">

      <h:outputText value="this is the footer"  />

  </f:facet>

</h:panelGrid>对应HTML语法：
<table class="table_content">

<thead>

  <tr><th class="headclass" colspan="2"

   scope="colgroup">tale demostration</th>

  </tr>

</thead>

<tfoot>

  <tr><td class="footclass"

   colspan="2">

    this is the footer </td>

  </tr>

</tfoot>

<tbody>

  <tr>

   <td class="column1">1</td>

   <td class="column2">2</td>

  </tr>

  <tr>

   <td class="column1">3</td>

   <td class="column2">4</td>

   </tr>

</tbody>

</table>



UIColumn和UIData
h:dataTable h:column
用法：
<h:dataTable id="news"

styleClass="table_content" value="#{bean.newsList}" var="alist">  

  <h:column>

    <f:facet name="header">

      <h:outputText  value="Title"/>

    </f:facet>

     <h:outputText value="#{bean.title}"/>

  </h:column>

  <h:column>

    <f:facet name="header">

     <h:outputText  value="Publish Date"/>

    </f:facet>

     <h:outputText value="#{bean.date}"/>

  </h:column>

</h:dataTable> 对应HTML语法：
<table id="form1:news"

class="table_content">

<thead>

  <tr>

   <th>Title</th>

   <th>Publish Date</th>

  </tr>

</thead>

<tbody>

  <tr>

   <td>

    Spring updated</td>

   <td>

    2006-03-10</td>

  </tr>

  <tr>

   <td>

    AJAX Revolution</td>

   <td>

    2006-03-01</td>

  </tr>

</tbody>

</table>



UISelectItems
h:selectItems
用法：
<h:selectOneMenu id="new"

value="#{bean.currentNew}">

  <f:selectItems

   value="#{bean.newsList}" />

</h:selectOneMenu> 对应HTML语法：
<select id="form1:new"

name="form1:new" size="1">

  <option value="ajax">Ajax Revolution</option>

  <option value="spring">Spring</option>

</select>



UISelectItem
h:selectItem
用法：
<h:selectOneMenu id="new"

  value="#{bean.currentNew}">

  <f:selectItem

    itemValue="ajax" itemLabel="Ajax Revolution"/>

  <f:selectItem

    itemValue="spring" itemLabel="Spring"/>

</h:selectOneMenu> 对应HTML语法：
<select id="form1:new"

name="form1:new" size="1">

  <option value="ajax">Ajax Revolution</option>

  <option value="spring">Spring</option>

</select>