집 >웹 프론트엔드 >JS 튜토리얼 >DOM object_javascript 기술의 지정된 노드에 액세스하는 방법의 JS 구현 예

DOM object_javascript 기술의 지정된 노드에 액세스하는 방법의 JS 구현 예

不言원래의: 2018-04-04 17:19:191747검색

이 글은 DOM 객체의 지정된 노드에 접근하는 JS의 방법을 주로 소개하며, DOM 요소 노드 속성에 대한 자바스크립트 관련 연산 기술을 예시 형식으로 분석합니다.

예문은 다음과 같습니다. 이 문서에서는 DOM 개체의 지정된 노드에 액세스하는 JS 구현을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 정보는 다음과 같습니다.

Introduction

getElementById() 메서드를 사용하여 지정된 ID로 노드에 액세스하고 getElementById()方法来访问指定id的节点，并用nodeName属性、nodeType属性和nodeValue属性来显示出该节点名称、节点类型和节点值。

1、nodeName属性

该属性用来获取某一个节点的名称。

[sName=]obj.nodeName

sName：字符串变量用来存储节点的名称。

2、nodeType属性

该属性用来获取某一个节点的类型。

[sType=]obj.nodeTypenodeName을 사용합니다.

속성,

nodeType 속성 및 nodeValue

속성을 사용하여 노드 이름, 노드 유형 및 노드 값을 표시합니다.

🎜nodeName🎜🎜Attribute🎜🎜이 속성은 노드의 이름을 가져오는 데 사용됩니다. 🎜🎜[sName=]obj.nodeName🎜🎜🎜sName🎜: 노드 이름을 저장하는 데 사용되는 문자열 변수입니다. 🎜🎜2. 🎜🎜nodeType🎜🎜Attribute🎜🎜이 속성은 노드의 유형을 가져오는 데 사용됩니다. 🎜🎜[sType=]obj.nodeType🎜🎜🎜sType🎜: 노드 유형을 저장하는 데 사용되는 문자열 변수, 이 유형의 값은 숫자입니다. 이 매개변수의 유형은 아래 표에 나와 있습니다. 🎜🎜🎜🎜

유형	숫자 값	노드 이름	설명
요소	1	태그	모든 HTML 또는 XML 태그
속성	2	속성	태그의 속성
텍스트(텍스트)	3	#text	태그의 텍스트를 포함합니다
Comment(댓글)	8	#comment	HTML comment
Document(문서)	9	#document	Document 개체
문서 유형(documentType)	10	DOCTYPE	DTD 사양

3, nodeValueAttribute

이 속성은 노드의 값을 반환합니다.

[txt=]obj.nodeValue

txt: 문자열 변수는 노드 값을 저장하는 데 사용됩니다. 텍스트 노드 유형을 제외하고 다른 유형의 노드 값은 "null"입니다.

을 사용하여 지정된 노드에 액세스합니다. 이 예에서는 지정된 노드의 이름, 노드 유형 및 노드 값이 페이지에 팝업되는 프롬프트 상자에 표시됩니다. .

세 개의 코드

<!DOCTYPE html>
<html>
<head>
<title>www.jb51.net 访问指定节点</title>
</head>
<body id="b1">
<h3 >三号标题</h3>
<b>加粗内容</b>
<script language="javascript">
 <!--
 var by=document.getElementById("b1");
 var str;
 str="节点名称:"+by.nodeName+"\n";
 str+="节点类型:"+by.nodeType+"\n";
 str+="节点值:"+by.nodeValue+"\n";
 alert(str);
 -->
</script>
</body>
</html>

네 번 실행하면 다음 프롬프트 상자가 나타납니다.

DOM object_javascript 기술의 지정된 노드에 액세스하는 방법의 JS 구현 예

관련 기사