除了之前介绍的伪类选择器,jQuery还为我们提供了其他用途的选择器,如下表所示。

其他伪类选择器
选择器 说明
:not(selector) 选取除了某个选择器之外的所有元素
:animated 选取所有正在执行动画的元素
:root 选取页面根元素,即html元素
:header 选取h1~h6的标题元素
:target 选取锚点元素
:lang(language) 选取特定语言的元素

在实际开发中,一般情况下只会用到:not()、:animated这两个,其他几乎用不上或者可以被其他选择器替代,所以只需要了解一下即可。

这一节我们先来了解一下:not()选择器。而对于:animated选择器,在“8.9 判断动画状态”这一节中再去学习。

举例::not(selector)

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script src="js/jquery-1.12.4.min.js"></script> <script> $(function () { $("li:not(#select)").css("color", "red"); }) </script> </head> <body> <ul> <li>HTML</li> <li>CSS</li> <li>JavaScript</li> <li id="select">jQuery</li> <li>Vue.js</li> </ul> </body> </html>

浏览器预览效果如图所示。

分析:

$("li:not(#select)")表示选取除了id="select"之外的所有li元素。