jQuery的基本选择器

  通过 jQuery 中的选择器实际上取得的是 HTML 中的 DOM 元素。在 jQuery 中使用 CSS 匹配(CSS like)来进行元素指定,比其他 JavaScript 库都简单,这也正是 jQuery 在网页设计人员中大受欢迎的理由了。
  在其核心,jQuery 重点放在从 HTML 页面里获取元素并对其进行操作。如果你熟悉 CSS ,就会很清楚选择器的威力,通过元素的特征或元素在文档中的位置去描述元素组。有了 jQuery ,就能够利用现有知识去发挥选择器的威力,在很大程度上简化 JavaScript 代码。

选择器和包装集

  为了式设计和内容分离而把 CSS 引入 Web 技术的时候,需要以某种方式从外部样式表中引用页面元素组。开发出来的方法就是通过使用选择器——基于元素的属性或元素在 HTML 文档中的位置,简明地表现元素。例如,选择器:

$("p a");

  引用所有嵌套于 p 元素之内的超链接 (a 元素)组。jQuery利用同样的选择器,不仅支持目前 CSS 中使用的常见选择器,还支持尚未被大多数浏览器完全实现的更强大的选择器。收集一组元素,可以使用如下简单的语法:

$(selector) 或者 jQuery(selector)

  也许刚开始你会觉得 $() 符号有点奇怪,但大部分 jQuery 用户很快就会喜欢上它的简洁。例如,为了获取嵌套在 p 元素内的一组超链接,我们使用如下语句:

$("p a")

  $() 函数返回特别的 JavaScript 对象,它包含着与选择器相匹配的 DOM 元素的数组。该对象拥有大量预定义的有用方法,能够作用于该组元素。
  用编程的话来说,这种构造称为包装器(wrapper),因为它用扩展功能来对匹配的元素进行包装。我们使用术语 jQuery 包装器或者包装集(wrapped set)来指能够在其上用 jQuery 定义的方法去操作的、匹配元素的集合。
     假定我们想选择带有 CSS 类 notLongForThisWorld 的所有元素。jQuery 语句如下所示:

$(".notLongForThisWorld");
基本选择器

  基本选择器是 jQuery 中最常用的选择器,也是最简单的选择器,它通过元素 id、class 和标签名等来查找 DOM 元素。在网页中每个 id 名称只能使用一次,class 允许重复使用。基本选择器的介绍说明如下表格所示:

选择器描述返回示例
#id根据给定的id
匹配一个元素
单个元素$("#test")选取id为
test的元素
.class根据给定的类名
匹配元素
集合元素$(".test")选取所有
class为test的元素
element根据给定的元素
名称匹配元素
集合元素$(“p”)选取所有的p
元素
selector1,
selector2,
  selector3…
将每一个选择器
匹配到的元素合
并后一起返回
集合元素$(“div,span,p,cls”)选取所有
的div,span和拥有class
为cls的p标签的一组元素
*匹配所有元素集合元素$("*")选取所有的元素

  我们现在可以用以上这些基本选择器来完成一些基本操作了,这些选择器将在下一节进行一一讲解。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值