abstrak：//層級(jí)選擇器$(‘父級(jí)元素>子元素’)給定的父級(jí)元素下匹配所有子元素$(‘祖元素 空格 后代元素’ )給定祖元素下的所有后代元素$(‘a(chǎn)+b’)a元素后面的b元素，a和b同級(jí)$(‘a(chǎn)~b’)a元素后面的所有的元素b//順序選擇器1、順序$(‘:first’)第一個(gè)元素 $(‘:last’)最后一個(gè)元素2、比較:從0開始$(‘:gt
//層級(jí)選擇器
$(‘父級(jí)元素>子元素’)給定的父級(jí)元素下匹配所有子元素
$(‘祖元素 空格 后代元素’ )給定祖元素下的所有后代元素
$(‘a(chǎn)+b’)a元素后面的b元素，a和b同級(jí)
$(‘a(chǎn)~b’)a元素后面的所有的元素b
//順序選擇器
1、順序
$(‘:first’)第一個(gè)元素 $(‘:last’)最后一個(gè)元素
2、比較:從0開始
$(‘:gt(x)’)大于x的元素
$(‘:lt(x)’)小于…
$(‘:eq(x)’)等于…
3、奇偶性
$(‘:odd’)奇數(shù)順序 $(‘:even’)偶數(shù)順序
4、非，匹配不是這個(gè)選擇器的所有元素
$(‘:not(selector)’)
//內(nèi)容選擇器
$(‘div:contains(jun)’)匹配內(nèi)容含jun的div
$(‘div:has(span)’)匹配含span選擇器的div
$(‘div:empty’)匹配不含有任何內(nèi)容的div
$(‘div:parent’)匹配含有子元素或文本的div
//屬性選擇器
$(‘input[type]’)匹配input中有type屬性的元素
$(‘input[type=text]’)type=text的元素
$(‘input[type!=text]’)不等于的元素
$(‘input[type^=t]’)type屬性開頭是t的元素
$(‘input[type$=n]’)type屬性結(jié)尾是n的元素
$(‘input[type*=o]’)type屬性包含o的元素
$(‘input[id][name*=n]’)滿足input中有id屬性和name屬性并且name屬性中包含n的元素
//表單選擇器
$(‘:enabled’)選擇表單內(nèi)所有激活的元素
$(‘:disabled’)選擇表單內(nèi)禁用的元素
$(‘:selected’)select所有被選中的元素
$(‘:checked’)input所有被選中的元素
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jQuery所有選擇器</title>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<style type="text/css">
#d1,#d2,#d3{
width: 100px;
height: 100px;
margin-top: 10px;
background-color: cyan;
}
</style>
</head>
<body>
<div>
<h1>注冊(cè)信息</h1>
<form action="" method="">
<p>
<label for="user">用戶名：</label>
<input type="text" id="user" placeholder="請(qǐng)輸入用戶名"></input>
<P>
<label for="password">密碼：</label>
<input type="password" id="password" placeholder="請(qǐng)輸入密碼"></input>
</P>
<P>
<label for="email">郵箱：</label>
<input type="email" id="email" placeholder="請(qǐng)輸入郵箱"></input>
</P>
<P>
<input type="radio" id="radio" name="radio" value="男" checked=""></input><label for="radio">男</label>
<input type="radio" id="radio" name="radio" value="女"></input><label for="radio">女</label>
</P>
<p>
興趣愛好：
<label><input type="checkbox" name="" checked=""></input>看書</label>
<label><input type="checkbox" name=""></input>玩游戲</label>
<label><input type="checkbox" name=""></input>唱歌</label>
<label><input type="checkbox" name="" checked=""></input>運(yùn)動(dòng)</label>
</p>
<p>
<label>星座：
<select>
<option selected="">巨蟹座</option>
<option>天蝎座</option>
<option>雙子座</option>
<option>處女座</option>
<option>天秤座</option>
</select>
</label>
</p>
</form>
</div>
<div id="d1">早上好</div>
<div id="d2">中午好
<span>好飽</span>
</div>
<div id="d3"></div>
<script>
$(document).ready(function(){
//層級(jí)選擇器
// $('select>option').css('background','pink')
// $('form input').css('background','pink')
// $('input+label').css('background','pink')
//$('label~input').css('background','pink')
//順序選擇器
// 1、順序
// $('input:first').css('background','pink')
// $('label:last').css('background','pink')
// 2、比較
// $('option:gt(1)').css('background','pink')
// $('option:lt(1)').css('background','pink')
// $('option:eq(2)').css('background','pink')
// 3、奇偶性
// $('option:odd').css('background','pink')
// $('option:even').css('background','pink')
// 4、非
// $('form:not(select)').css('background','pink')
//內(nèi)容選擇器
// $('label:contains(密碼)').css('background-color','pink')
// // $('div:has(span)').css('background-color','pink')
// $('div:empty').css('background-color','pink')
// $('div:parent').css('background-color','pink')
//屬性選擇器
// $('input[placeholder]').css('background-color','pink')
// $('input[placeholder=請(qǐng)輸入密碼]').css('background-color','pink')
// $('input[placeholder!=請(qǐng)輸入密碼]').css('background-color','pink')
// $('input[type^=t]').css('background-color','pink')
// $('input[type$=t]').css('background-color','pink')
// $('input[type*=t]').css('background-color','pink')
// $('input[id][type*=p]').css('background-color','pink')
//表單選擇器
// $(':enabled').css('background-color','pink')
// $(':disabled').css('background-color','pink')
$(':checked').parent().css('color','pink')
//$(':selected').css('background-color','pink')
})
</script>
</body>
</html>
Guru membetulkan：查無(wú)此人Masa pembetulan：2019-01-22 09:14:33
Rumusan guru：完成的不錯(cuò)。這章課，學(xué)了不少，一些常用的要牢記。加油