abstrakt:<!DOCTYPE html><html><head> <title>jquery選擇器</title></head><body><script type="text/javascript">//1基本選擇器//語法$('#id')根據(jù)ID$('.class名
<!DOCTYPE html>
<html>
<head>
<title>jquery選擇器</title>
</head>
<body>
<script type="text/javascript">
//1基本選擇器
//語法
$('#id')根據(jù)ID
$('.class名')根據(jù)給定的class名來匹配元素
$('element')根據(jù)給定的標(biāo)簽名來匹配元素
$('*')匹配所有元素
$('id,.class,element')匹配到頁面中的多個選擇器
//2層級選擇器(相當(dāng)于父類和子類的元素關(guān)系)
$('父級元素>子級元素')//給定的父級元素下匹配所有的子元素
$('祖先元素 后代元素')//級定的祖先元素下匹配所有的后代元素
$('prev +next')//匹配緊跟在prev元素后面的NEXT元素
$('prev ~ siblings')//匹配prev元素后面所有的siblings元素
//3.1順序選擇器
$(':first')第一個元素
$(':last')最后一個元素
//3.2比較
$(':gt(x)')表示大于值X的元素
$(':lt(x)')表示小于值X的元素
$(':eq(x)')表示等于值X的元素
//3.3奇偶數(shù)
$(':odd')奇數(shù)順序
$(':even')偶數(shù)順序
//4.非
$(':not(selector)')匹配不是selector的所有元素
//2內(nèi)容選擇器
語法
$(':contains(text)')匹配包含給定文本(text)的元素
$(':has(selector)')匹配包含特定選擇器元素的元素
$(':empty')匹配不含有內(nèi)容的元素(即 不包含子元素或者文本的空元素)
$(':parent')匹配含有子元素或者文本的元素
//3屬性選擇器
$('[屬性名]')匹配包含給定屬性的元素
例:$('input[type]').css('background','pink')
$('標(biāo)簽名[屬性名=value]')匹配給定屬性是某個特定值的元素
$('標(biāo)簽名[屬性名!=value]')匹配所有不含有指定值的屬性,或者說是屬性不等于特定值的元素
$('標(biāo)簽名[屬性名^=value]')匹配給定屬性是以某些值開始的元素
$('標(biāo)簽名[屬性名 $=value]')匹配給定屬性是以某些值結(jié)尾的元素
$('標(biāo)簽名[屬性名 *=value]')匹配給定屬性包含某些值的元素
$('標(biāo)簽名[屬性名] 標(biāo)簽名[屬性名] 標(biāo)簽名[屬性名]')復(fù)合選擇器,需要同時滿足多個條件時使用
例:$(input[id][name*=n]).css('background','red')
//4表單選擇器
$(':enabled')所有激活的input元素(可以使用的input元素)
$(':disabled')所有禁用的input元素(不可以使用的input元素)
$(':selected')所有被選取 的元素,針對于(select元素-->下拉框
$(':checked')所有被選中的input元素,針對于checked多選框,jq要用.parent().css(':parent')匹配含有子元素或者文本的元素
</script>
</body>
</html>
Korrigierender Lehrer:西門大官人Korrekturzeit:2019-04-08 10:19:11
Zusammenfassung des Lehrers:總結(jié)的很好,最好每個配上一個案例說明一下