abstrait:<!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">個(gè)人信息數(shù)據(jù)統(tǒng)計(jì)</p> <from> 您的姓名:<input type="text"></from><br><br> 您的年齡:<input type="text" name=""><br><br> 您的性別: <select> <option>男</option> <option selected>女</option> </select> <p>您的愛(ài)好:</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
Professeur correcteur:滅絕師太Temps de correction:2018-11-19 09:19:31
Résumé du professeur:完成的不錯(cuò),這樣學(xué)習(xí)又便于記住知識(shí)點(diǎn),繼續(xù)保持