JS簡單獲得節(jié)點元素的方法示例
更新時間：2018年02月10日 11:49:35 作者：群女神的熊寶
這篇文章主要介紹了JS簡單獲得節(jié)點元素的方法,結(jié)合實例形式分析了javascript獲取頁面節(jié)點元素及修改元素屬性相關(guān)操作技巧,需要的朋友可以參考下
本文實例講述了JS簡單獲得節(jié)點元素的方法。分享給大家供大家參考，具體如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>m.fzitv.net - JS幾種獲得節(jié)點元素的方法</title>
<script type="application/javascript">
/* window.onload=function(){//文檔就緒函數(shù) 表示當(dāng)文檔加載完成（圖片視頻等全部加載完成）
var d=document.getElementById('d');
//document.getElementByName();//得到數(shù)組 通過過下標調(diào)用
d.innerHTML='asddddddddddd';
//除通過Id查找（即getElementById）外其他幾種查找方式返回的都是數(shù)組，通過下表調(diào)用
}*/
window.onload=function(){
//找到Id為t1的td元素
var t1=document.getElementById('t1');
//獲取父節(jié)點元素tr 通過parentNode
var tr=t1.parentNode;
//通過style屬性設(shè)置背景顏色
tr.style.backgroundColor='green';
//獲取tr標簽的最后一個子元素
var t3=tr.lastChild;
//通過innerHTML屬性改變元素內(nèi)容
t3.innerHTML='qwer';
}
</script>
</head>
<body>
<table>
<tr> <td id="">1</td> <td>2</td> <td>3</td> </tr>
<tr> <td id="t1">1</td> <td>2</td> <td>3</td> </tr
<tr> <td>1</td> <td>2</td> <td>3</td> </tr>
</table>
</body>
</html>
運行效果：
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript頁面元素操作技巧總結(jié)》、《JavaScript操作DOM技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript錯誤與調(diào)試技巧總結(jié)》
希望本文所述對大家JavaScript程序設(shè)計有所幫助。
相關(guān)文章
這篇文章主要介紹了JS中的對象字面量，對ES6感興趣的同學(xué)，可以參考下2021-05-05
你真的了解BOM中的history對象嗎？具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
微信小程序van-field中的left-icon屬性自定義實現(xiàn)過程
在小程序中，我們是用 Vant 組件庫時，常常會用到 van-field 輸入框控件，今天我將跟大家分享的是 van-field 輸入框控件中的 left-icon 屬性的自定義怎么實現(xiàn)，感興趣的朋友一起看看吧2023-08-08
今天小編就為大家分享一篇快速解決bootstrap下拉菜單無法隱藏的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
想必大家對圖片翻轉(zhuǎn)效果都有所了解吧，其實很容易實現(xiàn)的，下面有個不錯的示例，喜歡的朋友可以參考下2014-01-01
JS實現(xiàn)兩個大數(shù)(整數(shù))相乘
大數(shù)，即超出語言所能表示的數(shù)字最大范圍的數(shù)字，那么如何實現(xiàn)兩個大數(shù)相乘呢？下面有個不錯的方法，大家可以參考下2014-04-04
下面小編就為大家分享一篇Js判斷H5上下滑動方向及滑動到頂部和底部判斷的示例代碼，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2017-11-11 
JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之基本排序算法定義與效率比較【冒泡、選擇、插入排序】
這篇文章主要介紹了JavaScript數(shù)據(jù)結(jié)構(gòu)與算法之基本排序算法定義與效率比較,結(jié)合實例形式詳細總結(jié)分析了javascript排序算法中的冒泡、選擇、插入等排序算法原理與操作技巧,需要的朋友可以參考下
2019-02-02 
不錯的獲取div高度的代碼，主要是方便測試一些信息，用到了javascript的offsetHeight屬性
2008-08-08