</script>
结果:
这是第一个p标签
这是第二个p标签
这是第三个p标签
18. :lt(index) : 匹配所有小于给定索引值的元素
<p>这是索引值为0的p标签</p>
<p>这是索引值为1的p标签</p>
<p>这是索引值为2的p标签</p>
<script type="text/javascript">
$(function(){
$("p:lt(1)").css("color","red");
});
</script>
结果:
这是索引值为0的p标签
这是索引值为1的p标签
这是索引值为2的p标签
19. :header : 匹配如 h1, h2, h3之类的标题元素
<p>这是p标签</p>
<h3>这是h3标签</h3>
<h4>这是h4标签</h4>
<script type="text/javascript">
$(function(){
$(":header").css("color","red");
});
</script>
结果:
这是p标签
这是h3标签
这是h4标签
20. :animated : 匹配所有正在执行动画效果的元素
<!--对不在执行动画的元素执行一个动画-->
<button id="run">Run</button>
<div style="width:100px;height:100px;border:1px solid #f00;position:absolute;"></div>
<script type="text/javascript">
$(function(){
$("#run").click(function(){
$("div:not(:animated)").animate({left:100+"px"},1000);
});
});
由于此处无法插入js代码,请自行复制代码查看效果
21. :focus : 匹配当前获取焦点的元素
<input type="text" />
<script type="text/javascript">
$(function(){
$("input").focus(); //让input自动获取焦点
$("input:focus").css("background","red");
});
结果:
22. :root : 选择该文档的根元素,在HTML中,文档的根元素,和$(“:root”)选择的元素一样,永远是<html>元素
<script type="text/javascript">
$(":root").css("background-color","yellow");
</script>
23. :target : 选择由文档URI的格式化识别码表示的目标元素
例如,给定的URI http://example.com/#foo, $( “p:target” ),将选择<p id=”foo”>元素。
24. :contains(text) : 匹配包含给定文本的元素
<div>boys</div>
<div>girls</div>
<div>boys and girls</div>
<script type="text/javascript">
$(function(){
$("div:contains('boys')").css("color","red");










