由获取子元素的方法find和children所获
生活随笔
收集整理的這篇文章主要介紹了
由获取子元素的方法find和children所获
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
html代碼如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd"> <html> <!--http://localhost:8080/ssh_easyui/test/findAndChildern.html--> <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title></title><script type="text/javascript" src="../js/easyui/jquery-1.8.0.min.js"></script><script type="text/javascript">function findTest() {var result = $("#tb>tbody").find("tr:eq(1)").find("td:eq(1)").html();console.info(result);var result2=$("#tb>tbody").find("td:eq(5)").html();console.info(result2);}function childrenTest() {var result2=$("#tb>tbody").children("tr:eq(1)").children("td:eq(1)").html();console.info(result2);}</script> </head> <body> <table border="1" id="tb"><tr><td>編號</td><td>姓名</td><td>年齡</td><td>性別</td></tr><tr><td>1</td><td>諾伊</td><td>18</td><td>女</td></tr><tr><td>2</td><td>王點點</td><td>22</td><td>女</td></tr><tr><td colspan="2"><input type="button" onclick="findTest()" value="測試Find"></td><td colspan="2"><input type="button" onclick="childrenTest()" value="測試Children"></td></tr> </table> </body> </html>區別：
find檢索范圍是所選元素的所有后代元素（子代+子代的子代......），檢索深度為N（N>0）
children檢索范圍僅僅是子代元素，檢索深度為1。
?
?
?
其代碼如下所示：
<script type = "text/javascript"> function findTest(){var result = $("#tb>tbody").find("tr:eq(1)").find("td:eq(1)").html();console.info(result);var result2 = $("#tb>tbody").find("td:eq(5)").html();console.info(result2); }function childrenTest(){var result2 = $("#tb>tbody").children("tr:eq(1)").children("td:eq(1)").html();console.info(result2); } </script> 輸出均為：諾伊 總結： 1.find獲取的是后臺元素，children獲取的是子代元素。 2.可以在selector中使用 :eq(index)這樣的選擇器進行元素選擇，比起get(index)或者[index]的好處是后者還要轉換成Jquery對象，利用:eq(index)選出來的就是Jquery對象了。 3. $("selector").html()和$("selector").val()區別是什么了？下個文章解釋。
?
轉載于:https://www.cnblogs.com/LiuChunfu/p/4933926.html
總結
以上是生活随笔為你收集整理的由获取子元素的方法find和children所获的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 银行卡可以跨行转账吗
- 下一篇： gta5富兰克林家位置在哪