1.層次選擇器-子元素選擇器
lol
alert($("div>p").length);//2
//逐層遍歷符合的元素
alert($("body>div>p").length)//1
//會定位到body的子div，然後定位子p
2.內容過濾器-has
123
var a = $("#dnf p:has(.lol)").length //這樣是獲取不到的
var b = $("#dnf:has(p):has(.lol)").length
var c= $("has(.lol)").length
alert(a);//0
alert(b);//1
alert(c);//3
has過濾器過濾的是後代元素
"#dnf p:has(.lol)"的意思是是否有這樣的p元素，它是應用id為dnf的後代元素，且改p元素的後代元素中有應用class為lol的元素
"#dnf:has(p):has(.lol)"的意思是是否有這樣的元素，它的id是dnf，且後代元素中有p元素，且有class為lol的元素」 html body div
":has(.lol)" 的意思是是否有這樣的元素，它的後代元素中有class為lol的元素，從html標籤開始逐層遍歷
3.內容過濾選擇器-empty
4.應用了class為lol的div元素
$("div.lol")
5.子元素選擇器，這裡已:nth-child()為例
元素的選擇是根據元素在父元素中的位置或唯一性決定的
(1)
$("ul li:nth-child(2n)").css("background","red");
$("li:nth-child(2n)").css("background","red");
兩個語句的效果相同，因為所有li元素的父元素都是ul
(2)678
9$("ul li:nth-child(2n)").css("background","red");
//ul下的li，innertext為2,4為紅色
$("li:nth-child(2n)").css("background","red");
//ul下的li，innertext為2,4為紅色
//innertext為6,7,8，9的li的父元素是body，6在body中是第2個元素，所以innertext為6的li背景色為紅色
///當然innertext為8的li背景色也為紅色
未完待續!
歡迎補充指正!
less封裝樣式有規律的類選擇器 遁地龍捲風
1.解決的問題 class rule p,2,width 20px animation dely 0.1s 可以生成下列css樣式 p2 p1 2.less class rule name,number,rest when number 0 class rule name,number 1,rest...
JQuery選擇器 選擇器簡介
在開始學習jquery選擇器之前，有必要了解一下css 層疊樣式表 技術。css是一項出色的技術，它使得網頁的結構和表現樣式完全分離。利用css選擇器能夠輕鬆的對某個元素新增樣式而不改變html結構，只需通過新增不同的css規則，就可以得到各種不同樣式的網頁。常用的css選擇器分類如下表 選擇器語法...
Jquery選擇器 基本選擇器
jquery作為我們常用前端工具之一，實際專案中常用的的選擇器有id選擇器 id 元素選擇器 element 樣式選擇器 class 概述 根據給定的id匹配乙個元素。使用任何的元字元 如 作為名稱的文字部分，它必須被兩個反斜槓轉義 引數 id,用於搜尋的，通過元素的 id 屬性中給定的值。示例 查...