码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript--选择器

时间:2015-12-06 17:35:09      阅读:2891      评论:0      收藏:0      [点我收藏+]

标签:

1、选择器是jQuery的根基,在jQuery中,对事件处理,遍历DOM和Ajax操作都依赖于选择器。

2、选择的优点:

--写法简洁;

--完善的事件处理机制。

3、基本选择器:

--基本选择器是jQuery中最常用的选择器,也是最简单的选择器,它通过元素id,class和标签名来查找DOM元素(在网页中id只能使用一次,class允许重复使用);

技术分享

4、层次选择器:

--如果想通过DOM之间的层次关系来获取特定元素,例如后代元素,子元素,相邻元素,兄弟元素等,则需要使用层次选择器;技术分享

--$("prev ~ div")选择器只能选择"#prev"元素后面的同辈元素;而jQuery中的方法siblings()与前后位置无关,只要是同辈节点就可以选取;

5、过滤选择器:

--过滤选择器主要是通过特定的过滤规则来筛选出所需的DOM元素,该选择器都以 ":" 开头;

--按照不同的过滤规则,过滤选择器可以分为基本过滤、内容过滤、可见性过滤、属性过滤、子元素过滤和表单对象属性过滤选择器;

--1)基本过滤选择器:

技术分享

--2)内容过滤选择器:内容过滤选择器的过滤规则主要体现在它所包含的子元素和文本内容上;

技术分享

--3)可见性过滤选择器:根据元素的可见和不可见状态来选择相应的元素;

--可见选择器:hidden不仅包含样式属性display为none的元素,也包含文本隐藏域(<input type="hidden"/>) 和visible:hidden之类的元素;

技术分享

--4)属性过滤选择器:通过元素的属性来获取相应的元素

技术分享

--5)子元素过滤选择器:

技术分享

--nth-child()选择器详解如下:

  --①:nth-child(even/odd):能选取每个父元素下的索引值为偶(奇)数的元素;

  --②:nth-child(2):能选取每个父元素下的索引值为2的元素;

  --③:nth-child(3n):能选取每个父元素下索引值是3的倍数的元素;

  --④:nth-child(3n+1):能选取每个父元素下索引值是3n+1的元素;

--6)表单对象属性过滤选择器:此选择器主要对所选择的表单进行过滤:

技术分享

--7)表单选择器:

技术分享

JavaScript--选择器

标签:

原文地址:http://www.cnblogs.com/tengtao93/p/5023820.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!