jQuery选择器小结
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery选择器</title>
<script type="text/javascript"src="jquery-3.3.1.min.js"></script>
</head>
<body>
<label id="box">jQuery选择器</label><br>
<label class="box">作业</label><br>
<form>
<label>姓名</label>
<input type="" name="">
<button>按钮</button>
</form>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<div>jack</div>
<div>jun</div>
<div>jack cheng</div>
<div>jion</div>
<div><span>PHP中文网</span></div>
<div></div>
<div><b></b></div>
<ul>
<li>1</li>
<li>1</li>
<div>
<li>2
<div>
<li>3</li>
</div>
</li>
</div>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
<form style="margin: ">
<label>1</label> <input type="text" name="new" id="woman"><br>
<label>2</label> <input type="password" name="new1" id="man"><br>
<label>3</label> <input name="new"id="new"><br>
<label>4</label> <input type="button" value="按钮" =""><br>
</form>
<form>
输入框1<input type="text" name=""><br>
输入框2<input type="text" name=""><br>
输入框3<input type="text" name="" disabled><br>
输入框4<input type="text" name=""><br>
<select>
<option>摩羯座</option>
<option selected>双鱼座</option>
<option>射手座</option>
<option>天蝎座</option>
</select>
<br>
爱好：
<label><input type="checkbox" name="">看书</label>
<label><input type="checkbox" name="" checked>游泳</label>
<label><input type="checkbox" name="">游戏</label>
</form>
<script type="text/javascript">
$(document).ready(function() {
$('#box').css('background', 'red')
$('.box').css('background', 'blue')
$('span').css('font-size','30px')
$('*').css('font-family','宋体')
$('#box,.box,span').css('color','pink')
$('ul>li').css('list-style','none')
$('ul li').css('list-style','none')
$('p:first').css('color','black')
$('p:last').css('color','blue')
$('p:eq(1)').css('color','red')
$('p:odd').css('background','#ccc')
$('p:even').css('background','pink')
$('input[type]').css('background','pink')
$('input[type=button]').css('background','lightblue')
$('input[type!=text]').css('background','red')
$('input[type ^=t ]').css('border','3px dashed red')
$('input[type $=n ]').css('background','#111')
$('input[type *=o ]').css('background','lightblue')
$('input[id][name*=n]').css('border','3px double blue')
$(':disabled').css('background','#999')
$(':selected').css('color','blue')
$(':checked').parent().css('color','red')
})
</script>
</body>
</html>