<p>这是索引值为0的p标签</p> <p>这是索引值为1的p标签</p> <p>这是索引值为2的p标签</p> <p>这是索引值为3的p标签</p> <script type="text/javascript"> $(function(){ $("p:odd").css("color","red"); }); </script>
结果:
这是索引值为0的p标签
这是索引值为1的p标签
这是索引值为2的p标签
这是索引值为3的p标签
14. :eq(index) : 匹配一个给定索引值的元素
<p>这是索引值为0的p标签</p> <p>这是索引值为1的p标签</p> <p>这是索引值为2的p标签</p> <script type="text/javascript"> $(function(){ $("p:eq(1)").css("color","red"); }); </script>
结果:
这是索引值为0的p标签
这是索引值为1的p标签
这是索引值为2的p标签
15. :gt(index) : 匹配所有大于给定索引值的元素
<p>这是索引值为0的p标签</p> <p>这是索引值为1的p标签</p> <p>这是索引值为2的p标签</p> <script type="text/javascript"> $(function(){ $("p:gt(1)").css("color","red"); }); </script>
结果:
这是索引值为0的p标签
这是索引值为1的p标签
这是索引值为2的p标签
16. :lang(language) : 选择指定语言的所有元素
<div lang="not">这是lang="not"的div标签</div> <div lang="en">这是lang="en"的div标签</div> <div lang="en-us">这是lang="en-us"的div标签</div> <script type="text/javascript"> $(function(){ $("div:lang(en)").css("color","red"); }); </script>
结果:
这是lang="not"的div标签
这是lang="en"的div标签
这是lang="en-us"的div标签
17. :last() : 获取最后个元素
<div> <p>这是第一个p标签</p> <p>这是第二个p标签</p> <p>这是第三个p标签</p> </div> <script type="text/javascript"> $(function(){ $("p:last").css("color","red"); }); </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>Run</button> <div></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 #foo, $( "p:target" ),将选择<p>元素。
24. :contains(text) : 匹配包含给定文本的元素