CSS selector

zorpan 發(fā)布于2019-08-30 14:05 / 1907人閱讀

摘要：選擇直接父元素為元素的元素選擇元素同級(jí)的第一個(gè)選擇元素同級(jí)的所有，選擇所有和選擇元素內(nèi)部的所有第一個(gè)編號(hào)為匹配父元素下僅有的一個(gè)子元素，匹配父元素下使用同種標(biāo)簽的唯一一個(gè)子元素，

div>p（選擇直接父元素為div元素的p元素）
div+p（選擇div元素同級(jí)的第一個(gè)p）
div~p （選擇div元素同級(jí)的所有p）
div，p （選擇所有div和p）
div p （選擇div元素內(nèi)部的所有p）

第一個(gè)child編號(hào)為1
p:nth-child(3)
p:nth-child(odd)
p:nth-child(even)
p:nth-child(2n+11)

p:nth-last-child(n)
p:last-child

p:nth-of-type(n)
p:nth-last-of-type(n)
p:last-of-type

p:not(:last-of-type)

p:only-child(匹配父元素下僅有的一個(gè)子元素，equal :first-child:last-child OR :nth-child(1):nth-last-child(1))
p:only-of-type(匹配父元素下使用同種標(biāo)簽的唯一一個(gè)子元素，equal :first-of-type:last-of-type OR :nth-of-type(1):nth-last-of-type(1))

p:root(匹配文檔的根元素，對(duì)于html文檔，就是html元素)
p:empty(匹配一個(gè)不包含任何子元素的元素，文本節(jié)點(diǎn)也被當(dāng)作子元素)

p:enabled
p:disabled
p:checked
:not(p)

p:first-of-type(parent下面第一個(gè)type是p的孩子)
p:first-child(nth-child(1))(parent下面第一個(gè)child, 必須是p)

$("input[name="aaa"]").attr("checked”) //checked屬性的值
$("input[name="aaa"]").prop("checked’) //radiobutton 選中 or 沒選中
$("input[name="aaa"]").is(":checked’) //radiobutton 選中 or 沒選中

$(’select option’).filter(‘:selected’)
$(’select option’).filter(‘[selected]’)

$(‘:text’).val($(‘’).val());

^= (start with)
$= (ends with)
= (exactly equal)
!= (not equal)
*= (contains)
e.g. $(‘[id^=“item”]")

云服務(wù)器 GPU云服務(wù)器 Selectors Selector css引入css css

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/115768.html

相關(guān)文章

我對(duì)CSS選擇器的認(rèn)識(shí)

摘要：還有兩個(gè)選擇器是功能性的，它們可以給元素已有內(nèi)容之前或之后添加新內(nèi)容。我做了一個(gè)項(xiàng)目，里面包含一個(gè)測(cè)試選擇器的小功能，請(qǐng)看這里。二歸納下文中所有的都代表任何一個(gè)有效的選擇器。我對(duì)CSS選擇器的認(rèn)識(shí) 一、簡(jiǎn)述　　　　CSS選擇器是對(duì)HTML元素進(jìn)行選擇的篩選條件，大概可以分為兩類：特征選擇器——根據(jù)元素自身所具有的某種特征進(jìn)行篩選，比如名稱、ID、屬性等；關(guān)系選擇器——根據(jù)元素與其他元...

李世贊 2019-04-23 13:27 評(píng)論0 收藏0
前端雜談: CSS 權(quán)重 (Specificity)

摘要：前端雜談權(quán)重權(quán)重想必大家都聽說過一些簡(jiǎn)單的規(guī)則大部分人也都知道較長(zhǎng)的權(quán)重會(huì)大于較短的權(quán)重高于但是具體規(guī)范是什么瀏覽器是按照什么標(biāo)準(zhǔn)來判定不同選擇器的權(quán)重的呢讓我們來看一下官方文檔是怎么說的第一個(gè)關(guān)鍵詞官方文檔中用特異性來表示一個(gè)和其元素的相前端雜談: CSS 權(quán)重 (Specificity) css 權(quán)重想必大家都聽說過, 一些簡(jiǎn)單的規(guī)則大部分人也都知道: 較長(zhǎng)的 css sele...

SimonMa 2019-08-29 17:18 評(píng)論0 收藏0
CSS Selector覆蓋順序

摘要：我們都知道的定義是可以被覆蓋的，但是覆蓋的順序可能并不清楚，本文的目的就在于介紹的覆蓋順序。之間的優(yōu)先級(jí)順序以下是不同之間的優(yōu)先級(jí)，選擇器。終極覆蓋法關(guān)鍵字能夠覆蓋一切定義，無(wú)視前面提到的優(yōu)先級(jí)順序。我們都知道CSS的定義是可以被覆蓋的，但是覆蓋的順序可能并不清楚，本文的目的就在于介紹CSS的覆蓋順序。三種類型CSS的優(yōu)先級(jí)順序 CSS有三種類型: inline style：以s...

bigdevil_s 2019-08-29 11:09 評(píng)論0 收藏0
JQuery干貨篇之處理元素

摘要：表示要設(shè)置的屬性名稱，返回值就是要設(shè)置的屬性值實(shí)例設(shè)置字體大小使用相對(duì)值設(shè)置屬性值，在原有的基礎(chǔ)上加上獲取標(biāo)簽的字體同時(shí)設(shè)置多個(gè)屬性方法方法設(shè)置或返回被選元素的文本內(nèi)容。 JQuery干貨篇之處理元素注意這里用的還是我前兩篇用的例子，詳情請(qǐng)看我的博客 attr attr() 方法設(shè)置或返回被選元素的屬性值。語(yǔ)法： $(selector).attr(attribute) 返回被選...

tuantuan 2019-08-29 12:27 評(píng)論0 收藏0
JQuery干貨篇之處理元素

摘要：表示要設(shè)置的屬性名稱，返回值就是要設(shè)置的屬性值實(shí)例設(shè)置字體大小使用相對(duì)值設(shè)置屬性值，在原有的基礎(chǔ)上加上獲取標(biāo)簽的字體同時(shí)設(shè)置多個(gè)屬性方法方法設(shè)置或返回被選元素的文本內(nèi)容。 JQuery干貨篇之處理元素注意這里用的還是我前兩篇用的例子，詳情請(qǐng)看我的博客 attr attr() 方法設(shè)置或返回被選元素的屬性值。語(yǔ)法： $(selector).attr(attribute) 返回被選...

weij 2019-08-20 16:01 評(píng)論0 收藏0
JQuery干貨篇之處理元素

摘要：表示要設(shè)置的屬性名稱，返回值就是要設(shè)置的屬性值實(shí)例設(shè)置字體大小使用相對(duì)值設(shè)置屬性值，在原有的基礎(chǔ)上加上獲取標(biāo)簽的字體同時(shí)設(shè)置多個(gè)屬性方法方法設(shè)置或返回被選元素的文本內(nèi)容。 JQuery干貨篇之處理元素注意這里用的還是我前兩篇用的例子，詳情請(qǐng)看我的博客 attr attr() 方法設(shè)置或返回被選元素的屬性值。語(yǔ)法： $(selector).attr(attribute) 返回被選...

zhaofeihao 2019-08-01 16:44 評(píng)論0 收藏0