abstract:<!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">个人信息数据统计</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');
匹配了特定的复合按钮被选取颜色改为红色,需要加parent()匹配含有子元素或者文本的元素,才能生效目标
<label><input type="checkbox" name="" checked>编程</label>
复合按钮是在input设置type的值为checkbox,在input标签中加入checked使得该目标为复合按钮的初始值
3,下拉框表单
<select> <option>男</option> <option selected>女</option> </select>
select为下拉框表单标签,option为表单内容标签,在option标签中加如selected元素则默认该目标为表单初始值
$(':selected').css('color','red');
匹配下拉框初始的css样式,颜色设置为red
Correcting teacher:灭绝师太Correction time:2018-11-19 09:19:31
Teacher's summary:完成的不错,这样学习又便于记住知识点,继续保持