Jquery小点滴 - 获取元素(一)
Jquery获取元素的形式很多。而且很灵活。
例子代码
<style>
.red{
color:#ff0000;
}
.blue{
color:#0000ff;
}
</style>
<div id=a class="red">Hello a</div>
<div id=b class="blue">Hello b</div>
<div id=c class="red">Hello c</div>
<div id=d class="blue">Hello d</div>
1. 根据ID获取元素, 使用#来告诉jquery以ID获取元素。这里会返回单一元素
如，把<div id=a class="red">拿出来
var obj = $("#a")；
alert(obj.html()); <!-- 这里会显示 Hello a -->
var obj = $("#d")；
alert(obj.html()); <!-- 这里会显示 Hello d -->
2. 根据使用css类来找元素， 返回的是一个元素数组。直接在元素选择器里把css的名字放进去就行。
如， 把所有使用red类的元素找出来。
var obj = $(".red")；
这里会回来2个元素。
<div id=a class="red">Hello a</div>
<div id=c class="red">Hello c</div>
alert(obj[0].html()); <!-- 这里会显示 Hello a -->
alert(obj[1].html()); <!-- 这里会显示 Hello c-->
如果class在整个页面都使用到，而又不想拿太多的元素回来，那这么办呢？
jquery提供了filter（过滤器）。
例子代码：
<style>
.red
{
color: #ff0000;
}
</style>
<div id="a">
<span class="red">Hello World a</span>
<span class="red">Hello World b</span>
</div>
<div id="b">
<span class="red">Hello World c</span>
</div>
这里先介绍其中一种filter。
<script language="javascript">
<!--
在这里，我们在元素选择器里写上 #a .red ,告诉选择器，在id是a的元素里找那些使用css class red的元素。
-->
var obj = $("#a .red");
</script>
以上代码，会找到2个元素。
<span class="red">Hello World a</span>
<span class="red">Hello World b</span>
而
<span class="red">Hello World c</span>是不会在被选择之列。因为它不再<div id="a"></div>里。