国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

解析dom中的children對象數組元素firstChild,lastChild的使用

2019-11-20 22:32:18
字體:
來源:轉載
供稿:網友

復制代碼 代碼如下:

<!--children對象數組元素示例 -->
<html>
<body>
  <table   id="tbl">  
  <tbody> <tr> <td> 行1列1 </td><td>行1列2 </td></tr>  
  <tr> <td> 行2列1 </td><td>行2列2 </td></tr>
  </tbody>
  </table>  
  <input   onclick="alert(document.all.tbl.children(0).children(0).innerHTML)"   value="children(0)"   type="button">  
  <input   onclick="alert(document.all.tbl.children(0).children(1).innerHTML)"   value="children(1)"   type="button">  
  <input   onclick="alert(document.all.tbl.children(0).children(1).children(0).innerHTML)"   value="children(2)"   type="button">
  <div   id=test>  
  <a></a>  
  <table></table>  
  </div>  

  <script>  
  alert(test.children[0].tagName)  
  alert(test.children[1].tagName)  
  </script>  

</body>
</html>

<!--在DOM中,整個頁面里的元素是個樹型結構
children 代表對象的子節點數組-->

document.all.tbl.children(0).children(0).innerHTML解釋
document.all.tbl.children(0)定位到table的第一個子節點<tbody>
document.all.tbl.children(0).children(0)定位到table的第一個子節點的第一個子節點<tr>,打印結果<td> 行1列1 </td><td>行1列2 </td>


document.all.tbl.children(0).children(1).innerHTML,打印結果<td> 行2列1 </td><td>行2列2 </td>


document.all.tbl.children(0).children(1).children(0).innerHTML 打印結果行2列2


<!--fistChild,lastChild示例-->
<html>
<body>
  <table   id="tbl">  
  <tbody> <tr id="tr1"> <td> 行1列1 </td><td>行1列2 </td></tr>  
  <tr> <td="tr2"> 行2列1 </td><td>行2列2 </td></tr>
  </tbody>
  </table>  
  <input   onclick="alert(document.all.tbl.firstChild.firstChild.innerHTML)"   value="children(0)"   type="button">  
  <input   onclick="alert(document.all.tbl.firstChild.lastChild.innerHTML)"   value="children(1)"   type="button">  
  <input   onclick="alert(document.all.tbl.firstChild.lastChild.firstChild.innerHTML)"   value="children(2)"   type="button">
  <div   id=test>  
  <a></a>  
  <table></table>  
  </div>  

  <script>  
  alert(test.firstChild.tagName)  
  alert(test.lastChild.tagName)  
  </script>  

</body>
</html>

document.all.tbl.firstChild定位到table的第一個子節點<tbody>
document.all.tbl.firstChild.firstChild定位到table的第一個子節點<tbody>
的第一個子節點<tr id="tr1">
document.all.tbl.firstChild.firstChild.innerHTML打印結果是<td> 行1列1 </td><td>行1列2 </td>


document.all.tbl.firstChild.lastChild定位到table的第一個子節點<tbody>
的最后子節點<tr id="tr2">
document.all.tbl.firstChild.lastChild.innerHTML打印結果是<td="tr2"> 行2列1 </td><td>行2列2 </td>


document.all.tbl.firstChild.lastChild.firstChild.innerHTML 打印結果是
行2列2

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 芦溪县| 阿克| 上犹县| 宜兴市| 平罗县| 大姚县| 嘉祥县| 土默特左旗| 苏尼特左旗| 吴江市| 剑阁县| 加查县| 大渡口区| 喀喇沁旗| 拉孜县| 嵊泗县| 朔州市| 清苑县| 永顺县| 永平县| 乌鲁木齐市| 亚东县| 社会| 牡丹江市| 称多县| 宝清县| 玉林市| 达拉特旗| 曲阳县| 新竹县| 眉山市| 洛阳市| 钟祥市| 新巴尔虎右旗| 利辛县| 重庆市| 渝北区| 临颍县| 凤山县| 泰和县| 靖宇县|