jQuery 入门教程(3): Selectors
jQuery Selector 是jQuery库中非常重要的一个组成部分。
jQuery Selector 用来选择某个HTML元素，其基本语句和CSS的选择器（Selector）是一样的，所有jQuery selector 都是以$()开始。
选择HTML标记
选择某个HTML元素的方法是直接使用该元素的标记名称，比如选择所有<p>元素
$("p")
下面的例子当用户点击一个按钮时，隐藏所有的<p>元素
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
#id 选择
jQuery #id 选择器用来选择定义了id 属性的元素，网页上元素的id应保证是唯一的，你可以使用id来选择单个唯一的元素。
比如下面的例子，当点击按钮时，只会隐藏id为test 的元素。
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();
});
});
</script>
</head>
<body>
<h2>This is a heading</h2>
<p>This is a paragraph.</p>
<p id="test">This is another paragraph.</p>
<button>Click me</button>
</body>
</html>
.class 选择器
jQuery .class 选择器选择所有定义了class属性为制定值的所有元素，比如下面的例子 隐藏所有类名称为test的元素：
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$(".test").hide();
});
});
</script>
</head>
<body>
<h2 class="test">This is a heading</h2>
<p class="test">This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button>
</body>
</html>
更多的例子
| 语法 | 说明 |