2.2 使用$()函数

我们通过jQuery的各种选择符和方法取得的结果集合会被包装在jQuery对象中。通过jQuery对象实际地操作这些元素会非常简单。可以轻松地为jQuery对象绑定事件、添加漂亮的效果,也可以将多重修改或效果通过jQuery对象连缀到一起。

 然而,jQuery对象与常规的DOM元素不同,而且也没有必要为实现某些任务给纯DOM元素或节点列表添加相同的方法和属性。在本章的最后一部分中,我们会介绍如何直接访问收集在jQuery对象中的DOM元素。

为了创建jQuery对象,就要使用$()函数。这个函数接受CSS选择符作为参数,充当一个工厂,返回包含页面中对应元素的jQuery对象。所有能在样式表中使用的选择符都可以传给这个函数,随后我们就可以对匹配的元素集合应用jQuery方法。

 让jQuery与其他JavaScript库协同工作

在jQuery中,美元符号$只不过标识符jQuery的“别名”。由于$()在JavaScript库中很常见,所以,如果在一个页面中使用了几个这样的库,那么就会导致冲突。在这种情况下,可以在我们自定义的jQuery代码中,通过将每个$的实例替换成jQuery来避免这种冲突。第10章还会介绍这个问题的其他解决方案。

有3种基本的选择符:标签名ID。这些选择符可以单独使用,也可以与其他选择符组合使用。表2-1展示了这3种基本的选择符。

表2-1 基本的选择符

选 择 符CSSjQuery说  明
标签名P {}$('p')取得文档中所有的段落
ID#some-id {}$('#some-id')取得文档中ID为some-id的一个元素
.some-class {}$('.some-class')取得文档中类为some-class的所有元素

第1章曾经提到过,在将方法连缀到$()工厂函数后面时,包装在jQuery对象中的元素会被自动、隐式地循环遍历。换句话说,这样就避免了使用for循环之类的显式迭代(这种迭代在DOM脚本编程中非常常见)。

在介绍了基本的情况之后,下面我们就开始探索选择符的一些更强大的用途。