快捷導(dǎo)航

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

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

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

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

一介紹

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

1、nodeName屬性

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

[sName=]obj.nodeName

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

2、nodeType屬性

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

[sType=]obj.nodeType

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

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

3、nodeValue屬性

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

[txt=]obj.nodeValue

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

二應(yīng)用

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

三代碼

<!DOCTYPE html>
<html>
<head>
<title>chabaoo.cn 訪問(wèn)指定節(jié)點(diǎn)</title>
</head>
<body id="b1">
<h3 >三號(hào)標(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)行彈出如下提示框：