jquery 中children、find区别
首先看一段HTML代码,如下:
<table id="tb">
<tr>
<td>0</td>
<td>1</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</table>
如果要获取第一个tr里边的第二个td的值:
children:
$('#tb>tbody').children('tr:eq(0) td:eq(1)').html()
find:
$('#tb>tbody').find('tr:eq(0) td:eq(1)').html()
结果:
children获取的值为:undefined
find获取的值为:4
结论:
children()方法查找的是孩子。(仅儿子辈)。
find()方法查找的是子孙后代。
.find()方法要注意的知识点:
1、find是遍历当前元素集合中每个元素的后代。只要符合,不管是儿子辈,孙子辈都可以。
2、find(selector)方法是返回匹配元素集合中每个元素的后代。参数是必选的,可以为选择器、jquery对象可元素来对元素进行筛选。
3、find只在后代中遍历,不包括自己。
解释:find只在后代中遍历,不包括自己:
<body>
<div class="css">
<p class="rain">测试1</p>
</div>
<div class="rain">
<p>测试2</p>
</div>
</body>
如果用find方法找到div里边含有rain的类:
$('div').find('.rain').css('color',"red");
结果:
结论:
上面例子中$(‘div’)包含两个元素,第一个元素符合要求,但第二个元素div本身的class虽然是“rain”,但其内部没有class=rain,所以不符合。