jQuery选择器
1.元素选择器
jQuery 元素选择器基于元素名选取元素。
在页面中选取所有 <p> 元素:$("p")
实例:
$(document).ready(function(){
$("button").click(function()[
$("p").hide();
]);
});
2.id选择器
实例:
<script>
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});
</script>
</head>
<body>
<h2>这是一个标题</h2>
<p>这是一个段落。</p>
<p id="test">这是另一个段落。</p>
<button>点我</button>
</body>
3.更多实例
$("*") 选取所有元素
$(this) 选取当前html元素
$("p.test") 选取class为test的<p>元素
$("p:first") 选取第一个<p>元素
$("ul li:first") 选取第一个<ul>的第一个<li>元素
$("ul li:first-child") 选取每一个ul的第一个<li>元素
$("tr:odd") 选取奇数位置的<tr>元素
$("tr:even") 选取偶数位置的<tr>元素
$("a[target='_blank']") 选取属性值target等于"_blank"的<a>元素
$("a[target!='_blank']")选取属性值target不等于"_blank"的<a>元素
实例:
<script>
$(document).ready(function(){
$("button").click(function(){
$("ul li:first-child").hide();
});
});
</script>
<body>
<p>List 1:</p>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Tea</li>
</ul>
<p>List 2:</p>
<ul>
<li>Coffee</li>
<li>Milk</li>
<li>Tea</li>
</ul>
<button>点我</button>
</body>
注意:
通过 $(":button") 可以选取所有 type="button" 的 <input> 元素 和 <button> 元素;
去掉button前面的:只能获取到button元素;