當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

jquery 中后代遍历之children、find区别

發布時間：2024/4/14 编程问答 38 豆豆

生活随笔收集整理的這篇文章主要介紹了 jquery 中后代遍历之children、find区别小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

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(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只在后代中遍歷，不包括自己：

1 <body> 2 <div class="css"> 3 <p class="rain">測試1</p> 4 </div> 5 <div class="rain"> 6 <p>測試2</p> 7 </div> 8 </body>

如果用find方法找到div里邊含有rain的類：

$('div').find('.rain').css('color',"red");

結果：

結論：

上面例子中$（‘div’）包含兩個元素，第一個元素符合要求，但第二個元素div本身的class雖然是“rain”,但其內部沒有class=rain，所以不符合。

轉載于:https://www.cnblogs.com/angry-apple/p/8257097.html

以上是生活随笔為你收集整理的jquery 中后代遍历之children、find区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。