jquery選擇器之內容過濾選擇器詳解_jquery

先寫出DOM元素的HTML結構：

複製程式碼 程式碼如下:

    /*高亮顯示*/
    .highlight{  
            background-color: gray
    }

複製程式碼 程式碼如下:

John Resign

John Resign

John Resign

George Martin

Malcom John Sinclair

J.Ohn

Has p

一、:contains(text)選取含有文本內容為「text」的元素

複製程式碼

程式碼如下:

$("div contains('John')").addClass("highlight"); //找所有包含"John" 的div 元素



二、:empty

選取不含任何子元素或文字的空元素用chrome瀏覽器審查元素可發現div為empty 的class樣式已改變

複製程式碼

程式碼如下:

$("div:empty").addClass("highlight");

三、:has(selector)選取含有選擇器所符合的元素的元素

複製程式碼

複製程式碼


複製程式碼

複製程式碼

複製程式碼 程式碼如下:

$("div:has(p)").addClass("highlight"); //找出所有包含p的div元素

四、:parent選取含有子元素或文字的元素標籤複製程式碼 程式碼如下:$("div:parent").addClass("highlight");  //找出所有含有子元素或文字的div元素