js 기반 DOM의 문서 객체의 일반적인 속성 메서드에 대한 자세한 설명
- 高洛峰원래의
- 2016-12-08 14:35:351227검색
-----소개
브라우저에 로드된 모든 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('hr'); 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('hahahah'); 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('hahahh') </script> </body> </html>