使用 jQuery，第 2 部分: 构建未来的 Web 应用程序

核心提示： 清单 8. 新的 data() 函数//createthedivlikewedidabove,butwithoutanyspecificinformation.Inthis//waywecancreateagenericHTMLlayoutandcustomizeitinourjQuerycod

清单 8. 新的 data() 函数

　　　
//　create　the　div　like　we　did　above,　but　without　any　specific　information.　In　this　
//　way　we　can　create　a　generic　HTML　layout　and　customize　it　in　our　jQuery　code.　
　
<td>　
　　<div　class="tab"></div>　
</td>　
　
//　Now　customize　each　tab　in　the　jQuery　code.　
　
$(".tab").eq(0).text("Messages");　
$(".tab").eq(0).data("link",　"messages.jsp");　
$(".tab").click(function(){　
　　window.parent.frames['content'].location　=　$(this).data("link");　
});　
　
//　Taking　this　a　step　further,　you　can　picture　all　this　information　coming　from　
//　an　external　properties　file　via　a　Java　array.　This　would　be　the　code　on　a　JSP　
//　page.　　
　
<%　
　//　array　containing　tab　names　
　String[]　tabNames;　
　//　array　containing　tab　links　
　String[]　links;　
　
　for　(int　i=0;　i<tabNames.length;　i++)　{　
%>　
　$(".tab").eq(<%=i%>).text("<%=tabNames[i]%>");　
　$(".tab").eq(<%=i%>).data("link",　"<%=links[i]　%>");　
<%　}　%>　
　
$(".tab").click(function(){　
　　window.parent.frames['content'].location　=　$(this).data("link");　
});

编缉推荐阅读以下文章

• 使用 jQuery，第 3 部分: 用 jQuery 和 Ajax 构建富 Internet 应用程序
• 使用 jQuery，第 1 部分: 将桌面应用程序引入浏览器