JS實(shí)現(xiàn)訪問DOM對象指定節(jié)點(diǎn)的方法示例

更新時(shí)間：2018年04月04日 11:30:46 作者：chengqiuming

這篇文章主要介紹了JS實(shí)現(xiàn)訪問DOM對象指定節(jié)點(diǎn)的方法,結(jié)合實(shí)例形式分析了javascript針對DOM元素節(jié)點(diǎn)屬性相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)訪問DOM對象指定節(jié)點(diǎn)的方法。分享給大家供大家參考，具體如下：

一介紹

使用getElementById()方法來訪問指定id的節(jié)點(diǎn)，并用nodeName屬性、nodeType屬性和nodeValue屬性來顯示出該節(jié)點(diǎn)名稱、節(jié)點(diǎn)類型和節(jié)點(diǎn)值。

1、nodeName屬性

該屬性用來獲取某一個(gè)節(jié)點(diǎn)的名稱。

[sName=]obj.nodeName

sName：字符串變量用來存儲節(jié)點(diǎn)的名稱。

2、nodeType屬性

該屬性用來獲取某一個(gè)節(jié)點(diǎn)的類型。

[sType=]obj.nodeType

sType：字符串變量，用來存儲節(jié)點(diǎn)的類型，該類型值為數(shù)值型。該參數(shù)的類型如下表所示。

類型	數(shù) 值	節(jié) 點(diǎn) 名	說明
元素（element）	1	標(biāo)記	任何HTML或XML的標(biāo)記
屬性（attribute）	2	屬性	標(biāo)記中的屬性
文本（text）	3	#text	包含標(biāo)記中的文本
注釋（comment）	8	#comment	HTML的注釋
文檔（document）	9	#document	文檔對象
文檔類型（documentType）	10	DOCTYPE	DTD規(guī)范

3、nodeValue屬性

該屬性將返回節(jié)點(diǎn)的值。

[txt=]obj.nodeValue

txt：字符串變量用來存儲節(jié)點(diǎn)的值，除文本節(jié)點(diǎn)類型外，其他類型的節(jié)點(diǎn)值都為“null”。

二應(yīng)用

訪問指定節(jié)點(diǎn),本示例在頁面彈出的提示框中，顯示了指定節(jié)點(diǎn)的名稱、節(jié)點(diǎn)的類型和節(jié)點(diǎn)的值。

三代碼

<!DOCTYPE html>
<html>
<head>
<title>www.dhdzp.com 訪問指定節(jié)點(diǎn)</title>
</head>
<body id="b1">
<h3 >三號標(biāo)題</h3>
<b>加粗內(nèi)容</b>
<script language="javascript">
 <!--
 var by=document.getElementById("b1");
 var str;
 str="節(jié)點(diǎn)名稱:"+by.nodeName+"\n";
 str+="節(jié)點(diǎn)類型:"+by.nodeType+"\n";
 str+="節(jié)點(diǎn)值:"+by.nodeValue+"\n";
 alert(str);
 -->
</script>
</body>
</html>

四運(yùn)行彈出如下提示框：