2.4 应用jQuery改写示例

在本章开头部分，使用传统的JavaScript方法编写了3个简单的例子。

例子1：给网页中所有的<p>元素添加onclick事件。
例子2：使一个特定的表格隔行变色。
例子3：对多选框进行操作，输出选中的多选框的个数。

下面利用刚学会的jQuery选择器以及隐式迭代的特性来重写这3个例子。

使用jQuery选择器重写例子1，代码如下。

$("p").click(function(){ //获取页面中的所有p元素，给每一个p元素添加单击事件
    //doing something
})

使用jQuery选择器重写例子2，代码如下：

/*
 *获取id为tb的元素，然后寻找它下面的tbody标签，再寻找tbody下索引值是偶数的tr元素，
 * 改变它的背景色。
 *css("property","value")：用来设置jQuery对象的样式
 */
$("#tb tbody tr:even").css("backgroundColor", "#888");

使用jQuery选择器重写例子3，代码如下：

$("#btn").click(function() {
    //先使用属性选择器，然后用表单对象属性过滤，最后获取jQuery对象的长度
    var items = $("input[name='check']:checked");
    alert("选中的个数为：" + items.length);
});

很快就改完了，仅仅使用了几个简单的jQuery 选择器，而且它们的运行效果与改写前是完全相同的。