选择器按属性,子元素,表单匹配元素
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>属性 子元素 表单</title> <style type="text/css"> </style> <script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script> <script type="text/javascript"> $(function(){ //属性 $("input[name]").css(‘border-color‘,‘red‘);//具有name属性的input标签 $("input[name=‘zhanghao‘]").css(‘height‘,‘20px‘);//匹配指定name属性值的input标签 $("input[name!=‘zhanghao‘]").css(‘height‘,‘20px‘);//匹配name属性不是指定值的input标签 $("input[name^=zh]")//匹配name值以zh开头的input标签 $("input[name$=ma]")//匹配name值以ma结尾的input标签 $("input[name*=m]")//匹配name值含有m的input标签 // $("input[][][]")[]可以有一个属性选择一共可以有多个选择 //子元素 $("form input:nth-child(1)").css(‘font-size‘,‘20px‘);//查找所有form的第一个input字标签nth-child()角标从1开始 $("form input:first-child")//查找每一个form的第一个input标签 $("form input:last-child")//查找每一个form的最后一个input标签 $("form input:only-child")//查找所有form标签只有唯一子元素的input标签 //表单 $(‘:input‘)//匹配所有的input textarea select button元素 $(‘:text‘)//匹配所有文本框 $(‘:password‘)//匹配所有密码框 $(‘:radio‘)//匹配所有单选按钮 $(‘:checkbox‘)//匹配所有复选框 $(‘:submit‘)//匹配所有提交按钮 $(‘:image‘)//匹配所有图像域 $(‘:reset‘)//匹配所有重置按钮 $(‘:button‘)//匹配所有按钮 $(‘:file‘)//匹配所有文本域 $(‘:hidden‘)//匹配所有不可见元素 $(‘:enabled‘)//匹配所有可用元素 $(‘:disabled‘)//匹配所有不可用元素 $(‘:checked‘)//匹配所有被选中的元素 $(‘selected‘)//匹配所有选中的option元素 }) </script> </head> <body> <form> 帐号:<input type="text" name="zhanghao"><br/> 密码:<input type="password" name="mima"><br/> <input type="button" value="完成"> </form> </body> </html>
时间: 2024-11-24 05:49:20