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

核心提示： 在试图向页面添加交互性时，此函数十分有用，使用 jQuery，第 2 部分: 构建未来的 Web 应用程序(6)，实际上，在添加 data() 函数（如下所示）之前，其效果与以编程方式更改元素外观或行为相同， 清单 5. 利用 attr(str) 更改属性//willchangetheimage

在试图向页面添加交互性时，此函数十分有用。实际上，在添加 data() 函数（如下所示）之前，通常都必须将所需信息压缩到一个可用变量内。例如，假设有一个页面具有两个框架，第一个框架显示选项卡，底部框架显示每个选项卡的内容，那么可以这样设置：

清单 4. 应用 attr()

　　　
<!--　This　would　appear　in　the　top　frame　as　a　tab.　The　CSS　file　would　control　how　
　　　the　tab　appears,　and　the　only　HTML　code　needed　would　be　this　-->　
<td>　
　　<div　class="tab"　id="/messages.jsp">Messages</div>　
</td>　
　
//　This　code　would　appear　in　the　jQuery　section.　Notice　how　we　get　the　ID　from　the　tab,　
//　and　use　that　information　to　set　the　bottom　frame,　named　'content'　with　the　content　
//　on　the　page　"messages.jsp"　
　
$(".tab").click(　function()　{　
　　window.parent.frames['content'].location　=　$(this).attr("id");　
});

除了获得 每个元素上的属性值外，还可以设置 这些值。其效果与以编程方式更改元素外观或行为相同。

清单 5. 利用 attr(str) 更改属性

　　　
//　will　change　the　image　source,　and　the　image　displayed　on　the　page　will　change　
$("img").attr("src",　"myimage.jpg");　
　
//　will　change　all　the　links　on　the　page　to　go　to　one　specific　page　
$("a").attr("href",　"mypage.html");　
　
//　will　change　the　maxLength　on　all　password　fields　to　10　characters　
$(":password").attr("maxLength",　"10");

编缉推荐阅读以下文章

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