jQuery中children和find的区别

首先看一段HTML代码，如下：

1 <table id="tb">

2 <tr>

3 <td>0</td>

4 <td>1</td>

5 <td>2</td>

6 </tr>

7 <tr>

8 <td>3</td>

9 <td>4</td>

10 <td>5</td>

11 </tr>

12 </table>

如果要获取第二个tr里的第二个td的值：

Children：

$("#tb>tbody")children("tr:eq(1) td:eq(1)")html()

Find ：

$("#tb>tbody")find("tr:eq(1) td:eq(1)")html()

结果，通过children获取的值为：null,而通过find获取的值为：4 这是为什么呢？

查了一下资料，通过children获取的是该元素的下级元素，而通过find获取的是该元素的下级所有元素。

这时回到上面，可以得出，$("#tb>tbody")children() 获取的是两个tr元素（不包括它们子元素td），

而children里面的选择器则是在获取的两个tr元素里再根据条件进行筛选，所以上面那种写法获取不到值。

如果一定用children可以这样写：

$("#tb>tbody")children("tr:last")children("td:eq(1)")html()

<select id="selects">

<option value="0" selected>1</option>

<option value="1">1</option>

<option value="2">2</option>

</select>

<div id="result"></div>

--------------------------------------------------------

$("#selects")change(function(){ //下拉框改变时取得值

$("#result")html($(this)val()); //显示值

});

方法很多，比如:

1、依次按节点获取，比如$("input")find(xx)，xx就是你新追加在某个元素后面的元素。

2、apppnd("<div class='className'>content</div");

$("divclassName");

可以通过类名的不同，比如

<ul>

<li class=“li”>第一个子元素</li>

<li class=“li spe”>第二个子元素</li>

<li class=“li”>第三个子元素</li>

</ul>

可以使用$("ul")children("spe")来获得第二个子元素

也可以找到是第几个使用$("ul")find("li")eq(1)找到第二个子元素

如果是不一样的子元素，比如

<div class="mydiv">

<p>第一个子元素</p>

<div>第二个子元素</div>

<a>第三个子元素</a>

</div>

获取p标签$("mydiv")find("p")或者$("mydiv")children("p");

以上就是关于jQuery中children和find的区别全部的内容，包括:jQuery中children和find的区别、利用JQuery动态获取下拉框的值，在jsp页面上显示。、jquery获取到最新追加 的那个元素 怎么获取到等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！