摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src="jquery-3
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(document).ready(function(){
$('input[type=text]').css('background','pink');
$(':selected').css('color','red');
$('input[checked]').parent().css('color','red');
var a=$('input[type]')
})
</script>
<div style="background-color: #ccc;text-align: center;">
<p style="font-size: 20px;color: red;font-weight: bold">個人信息數(shù)據(jù)統(tǒng)計</p>
<from>
您的姓名：<input type="text"></from><br><br>
您的年齡：<input type="text" name=""><br><br>
您的性別：
<select>
<option>男</option>
<option selected>女</option>
</select>
<p>您的愛好：</p><label><input type="checkbox" name="" checked>游泳</label>
<label><input type="checkbox" name="" >打球</label>
<label><input type="checkbox" name="" checked>編程</label>
<label><input type="checkbox" name="">游戲</label><br><br>
<input type="button" value="提交" id="bt">
</from>
<div>
</body>
</html>JQuery的選擇器
1，屬性選擇器
$('input[type=text]').css('background','pink');匹配了type元素值為text的特定元素的css樣式背景顏色改為pink;
2,表單選擇器
$('input[checked]').parent().css('color','red');匹配了特定的復(fù)合按鈕被選取顏色改為紅色，需要加parent()匹配含有子元素或者文本的元素，才能生效目標(biāo)
<label><input type="checkbox" name="" checked>編程</label>
復(fù)合按鈕是在input設(shè)置type的值為checkbox，在input標(biāo)簽中加入checked使得該目標(biāo)為復(fù)合按鈕的初始值
3，下拉框表單
<select> <option>男</option> <option selected>女</option> </select>
select為下拉框表單標(biāo)簽，option為表單內(nèi)容標(biāo)簽，在option標(biāo)簽中加如selected元素則默認(rèn)該目標(biāo)為表單初始值
$(':selected').css('color','red');匹配下拉框初始的css樣式，顏色設(shè)置為red
批改老師：滅絕師太批改時間：2018-11-19 09:19:31
老師總結(jié)：完成的不錯，這樣學(xué)習(xí)又便于記住知識點，繼續(xù)保持