jQuery_2_常规选择器-进阶选择器
2017-03-29 14:12
232 查看
进阶选择器:
1. 群组选择器 $("span,em,#box") 获取多个选择器的DOM对象
2. 后代选择器 $("ul li a") 获取追溯的多个DOM对象
3. 通配器选择器 $("*") 获取所有元素标签的DOM对象
4.限定选择器
5.多class选择器
6. 在构造选择器时,有一个通用的优化原则:只主球必要的确定性
1. 群组选择器 $("span,em,#box") 获取多个选择器的DOM对象
<div id="d1">div</div> <div>div</div> <div>div</div> <p class="c1">p</p> <p class="c1">p</p> <p>p</p> <strong>strong</strong> <strong>strong</strong> <strong>strong</strong>
div,p,strong{ color:red; } #d1,.c1,strong{ color:red; }
$("div,p,strong").css("color", "red"); $("#d1,.c1,strong").css("color", "red");
2. 后代选择器 $("ul li a") 获取追溯的多个DOM对象
<ul> <li><a href="###">首页</a></li> <li><a href="###">首页</a></li> <li><em>首页</em></li> <li><strong>首页</strong></li> </ul> <a href="###">首页</a> <a href="###">首页</a> <p>首页</p> <p>首页</p> <span>首页</span> <span>首页</span>
ul li a{ color:green; }
$("ul li a").css("color", "green");
3. 通配器选择器 $("*") 获取所有元素标签的DOM对象
*{ color:orange; } ul li *{ color:green; }
alert($("*").size()); //通配符选择器 alert($("*")[5].nodeName); $("*").css("color", "blue"); //在全局范围使用*,会极大的消耗资源,所以不建议在全局使用 $("ul li *").css("color", "red"); //统配选择器应用在局部的环境内
4.限定选择器
5.多class选择器
<div class="c1 c2">div</div> <p class="c1">p</p> <div class="c2">div</div> <p class="c1">p</p>
div.c1{ color:red; .c1.c2{ color:green;
$("div.c2").css("color", "red"); //限定选择器 $(".c1.c2").css("color", "blue");//多class选择器
6. 在构造选择器时,有一个通用的优化原则:只主球必要的确定性
$("div$box p ul li a#link") //可以,选择器越复杂,那么字符串解析就越慢 $("#link");//单个ID不需要字符串解析,就可以获取到
相关文章推荐
- jQuery_2_常规选择器-高级选择器2
- jQuery_2_常规选择器-简单选择器
- jQuery_2_常规选择器-高级选择器
- jquery选择器-根据多个属性选择示例代码
- 通过Jquery中的选择器选择相同的className统一处理表单(可以同时处理多个表单在一个网页中)
- jsoup 选择器(一)常规选择器
- jQuery的:nth-child(n)选择器用于匹配作为父元素下的第n个(或特定顺序的)子元素的元素,将其封装为jQuery对象并返回。 与该选择器相对的是:nth-last-child(n)选择
- CSS 选择器、jQuery选择器大全
- jquery的选择器的使用技巧之如何选择input框
- 如何判断jquery选择器选择结果是否存在
- jQuery内容过滤选择器选择元素实例讲解
- jQuery选择器之子元素筛选选择器
- jQuery城市选择器(仿51选择)
- jquery内容选择器(匹配包含指定选择器的元素)
- [JQuery]学习——常规选择器
- Jquery选择器中使用变量实现动态选择例子
- jQuery基础---常规选择器
- Jquery选择器之可见性选择器、属性过滤选择器
- jQuery选择器之属性选择器Demo
- jquery中选择第n个孩子的选择器即nth-child选择器