摘要:<!DOCMENT TYPE> <head> <title>课后练习-jQuery选择器</title> <style type="text/css"> .clear{clear:both;}  
<!DOCMENT TYPE> <head> <title>课后练习-jQuery选择器</title> <style type="text/css"> .clear{clear:both;} li{list-style:none;} li{width: 100px;height: 40px;line-height:40px;float:left;} form{width:600px;margin:0 auto;border:1px solid #333;margin-top:20px;} </style> <script src="jquery-3.3.1.min.js"></script> <script type="text/javascript"> $(function () { $('li:first').css('color', '#f00'); $('li:eq(12)').css('color', '#e50'); $('li:odd').css('backgroundColor', '#eee'); $('li:contains(成都)').css('fontSize', '20px'); $('li:gt(17)').css('width', '200px'); $('li:has(i)').css('fontWeight', '700'); $('li:empty').css('background', '#ff0'); $('input,textarea,select').css('display', 'block'); $('input[type=text],input[type=password]').css('width', '200px'); $('input[type=text],input[type=password]').css('margin', '10px'); $('input[type=radio]').css('display', 'inline-block'); $(':selected').css('color', 'red'); }); </script> </head> <body> <div id="area"> <div id="prov"> <h3>四川</h3> <div class="city"> <ul> <li>成都</li> <li>自贡</li> <li>攀枝花</li> <li>泸州</li> <li>德阳</li> <li>绵阳</li> <li>广元</li> <li>遂宁</li> <li>内江</li> <li>乐山</li> <li><i>南充</i></li> <li>眉山</li> <li>宜宾</li> <li>广安</li> <li>达州</li> <li>雅安</li> <li>巴中</li> <li>资阳</li> <li>阿坝藏族羌族自治州</li> <li>甘孜藏族自治州</li> <li></li> <li>凉山彝族自治州</li> </ul> </div> </div> </div> <div class="clear"></div> <form> <input type="text" name="user" value="123" /> <input type="password" name="pass" value="456" /> <input type="radio" name="sex" value="男" checked="checked" />男 <input type="radio" name="sex" value="女" />女 <textarea></textarea> <select name="city"> <option>1</option> <option selected>2</option> <option>3</option> </select> <button>提交</button> </form> </body> </html>
批改老师:韦小宝批改时间:2019-03-01 09:08:29
老师总结:写的很不错 jQuery中的选择器还是比较好理解的 和css中使用的几乎一样