jQuery学习-属性选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>属性选择器</title> <script src="js/jquery.js"></script> <script type="text/javascript"> $(function(){ //选择input标签 下类型属性为text和password的输入框 $("input[type='text']").css("border","1px solid red"); $("input[type='password']").click(function(){ alert("点击事件!") }); //利用尾匹配完成对.cn结尾的超链接筛选 //$=代表以XXX结尾的情况 $("a[href$='.cn']").css("border","1px solid green"); //^=代表头匹配,筛选http://开头的超链接 $("a[href^='http://']").css("border","1px solid red"); //*=代表任意属性匹配,标签中任意属性值包含有'input'都会被选中 $("*[value*='input']").css("border","2px solid red"); //选择拥有rows属性的组建 $("*[rows]").css("border","2px solid red"); //选择 选中的单选框 多条件组合 $("input[type='radio'][checked='checked']").css("width","100px"); $("input[type='checkbox'][checked='checked']").css("width","100px"); //被禁用的文本框 $("input[type='text'][disabled='disabled']").css("border","1px solid blue"); }); </script> </head> <body> <div> <input type="text" value="123"></input> <br> <input type="text" value="input111"></input> <br> <input type="text" value="333"></input> <br> <input type="password" ></input> <br> <input type="text" disabled="disabled" value="diididid"></input> <br> <br><!--[if IE]> <![endif]--> <a href="www.sina.com.cn">sina</a> <br /> <a href="http://baidu.com">baidu</a> <br /> <textarea rows="2" ></textarea> <br /> <input type="radio" checked="checked" />女 <input type="radio" />男 <br /> <input type="checkbox" checked="checked" />1 <input type="checkbox" />2 <input type="checkbox" />3 </div> </body> </html>