js 기반 DOM의 문서 객체의 일반적인 속성 메서드에 대한 자세한 설명-JS 튜토리얼-php.cn

js 기반 DOM의 문서 객체의 일반적인 속성 메서드에 대한 자세한 설명

高洛峰

풀어 주다： 2016-12-08 14:35:35

원래의

1260명이 탐색했습니다.

-----소개

브라우저에 로드된 모든 HTML 문서는 Document 객체가 됩니다.

문서 개체를 사용하면 스크립트에서 HTML 페이지의 모든 요소에 액세스할 수 있습니다.

속성

1 document.anchors 문서의 모든 Anchor 개체에 대한 참조를 반환합니다. document.links/document.forms/document.images 등도 있습니다.

2 document.URL 현재 문서의 URL을 반환합니다.

3 document.title 현재 문서의 제목을 반환합니다. document

4 document.body 본문 요소 노드를 반환합니다.

메서드

1 document.close() document.open() 메서드로 열린 출력 스트림을 닫고 표시합니다. 선택한 데이터.

<!DOCTYPE html>
<html>
<head>
<script>
function createDoc()
{
var w=window.open();
w.document.open();
w.document.write("<h1>Hello World!</h1>");
w.document.close();
}
</script>
</head>
 
<body>
<input type="button" value="New document in a new window" onclick="createDoc()">
</body>
</html>

로그인 후 복사

2 document.createElement() 요소 노드를 생성합니다.

<!DOCTYPE html>
<html>
<!DOCTYPE html>
<head>
</head>
<body>
  <p>hello world</p>
   
<script>
  var a = document.createElement(&#39;hr&#39;);
  document.body.appendChild(a)
 
 
</script>
</body>
</html>

로그인 후 복사

3 document.createAttribute() 속성 노드를 생성합니다.

<!DOCTYPE html>
<html>
<body>
 
<p id="demo">Click the button to make a BUTTON element.</p>
 
<button onclick="myFunction()">Try it</button>
 
<script>
 
function myFunction()
{
var btn=document.createElement("BUTTON");
document.body.appendChild(btn);
};
 
</script>
 
</body>
</html>

로그인 후 복사

4 document.createTextNode() 텍스트 노드를 만듭니다.

<!DOCTYPE html>
<html>
<!DOCTYPE html>
<head>
</head>
<body>
  <p>hello world</p>
 
<script>
  var a = document.createTextNode(&#39;hahahah&#39;);
  document.body.appendChild(a)
 
 
</script>
</body>
</html>

로그인 후 복사

5 document.getElementsByClassName() 문서에서 지정된 클래스 이름을 가진 모든 요소의 컬렉션을 NodeList 개체 컬렉션으로 반환합니다. 소위 NodeList 객체 컬렉션은 배열과 유사한 데이터 형식입니다. 길이 속성만 제공하며 배열의 push 및 pop 메서드는 제공되지 않습니다.

6 document.getElementById() 지정된 ID를 가진 첫 번째 객체에 대한 참조를 반환합니다.

7 document.getElementsByName()은 지정된 이름을 가진 객체 컬렉션을 반환합니다.

8 document.getElementsByTagName()은 지정된 태그 이름을 가진 객체 컬렉션을 반환합니다.

9 document.write()는 HTML 표현식이나 JavaScript 코드를 문서에 작성합니다. 참고: HTML 문서가 로드된 후 write 메소드를 사용하면 쓰기 내용이 원본 HTML 문서를 덮어쓰게 됩니다.

<!DOCTYPE html>
<html>
<!DOCTYPE html>
<head>
</head>
<body>
  <p>hello world</p>
 
<script>
  document.write(&#39;hahahh&#39;)
 
 
</script>
</body>
</html>

로그인 후 복사