选择器按属性,子元素,表单匹配元素

<!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>
05-01 05:51