> 웹 프론트엔드 > JS 튜토리얼 > DOM 객체 노드 메소드에 대한 JS 액세스 요약

DOM 객체 노드 메소드에 대한 JS 액세스 요약

php中世界最好的语言
풀어 주다: 2018-06-11 14:28:30
원래의
2320명이 탐색했습니다.

이번에는 JS로 DOM 객체 노드에 접근하는 방법을 요약해보겠습니다. JS로 DOM 객체 노드에 접근할 때 주의할 점은 무엇인가요?

Introduction

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

1、nodeName属性

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

[sName=]obj.nodeName

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

2、nodeType属性

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

[sType=]obj.nodeTypenodeName

속성,

nodeType 속성 및 nodeValue

속성을 사용하여 표시합니다. 노드 이름, 노드 유형 및 노드 값. 🎜🎜1. 🎜🎜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"입니다.

2

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

세 개의 코드

<!DOCTYPE html>
<html>
<head>
<title>访问指定节点</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>
로그인 후 복사

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

이 기사의 사례를 읽은 후 방법을 마스터했다고 믿습니다. 더 흥미로운 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 주목해 주세요!

추천 도서:

js+css+html을 사용하여 타이핑 애니메이션 기능 만들기

mint-ui를 사용하여 휴대폰에서 3단계 연결 만들기

위 내용은 DOM 객체 노드 메소드에 대한 JS 액세스 요약의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿