>  기사  >  웹 프론트엔드  >  JavaScript와 dom의 관계는 무엇입니까?

JavaScript와 dom의 관계는 무엇입니까?

青灯夜游
青灯夜游원래의
2021-10-09 15:49:392525검색

Dom(문서 개체 모델)은 JavaScript에 웹 페이지 콘텐츠 처리를 위한 메서드와 인터페이스를 제공합니다. 웹 페이지에서 JavaScript가 수행하는 모든 작업은 DOM을 통해 수행됩니다.

JavaScript와 dom의 관계는 무엇입니까?

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

완전한 JavaScript는 다음 세 부분으로 구성됩니다.

  • Core(ECMAScript): 언어의 구문과 기본 개체를 제공합니다.

  • Document Object Model(DOM): 웹 콘텐츠 처리를 위한 메서드와 인터페이스를 제공합니다. ;

  • 브라우저 개체 모델(BOM): 브라우저와 상호 작용하기 위한 메서드와 인터페이스를 제공합니다.

Document Object Model(DOM):

DOM(Document Object Model)은 HTML 및 XML용 API(응용 프로그래밍 인터페이스)입니다. DOM은 전체 페이지를 노드 계층으로 구성된 문서로 계획합니다. HTML 또는 XML 페이지의 각 부분은 노드의 파생물입니다.

DOM은 트리를 생성하여 문서를 표현하므로 개발자는 문서의 내용과 구조를 전례 없이 제어할 수 있습니다. DOM API(getElementById, childNodes,appendChild, innerHTML)를 사용하여 노드를 쉽게 제거, 추가 및 교체할 수 있습니다.

DOM과 JavaScript의 관계

우리 모두는 JavaScript가 프로그래밍 언어이고 .js 파일이 JavaScript로 작성된 코드라는 것을 알고 있는데, DOM은 어떤 역할을 할까요?

DOM은 프로그래밍 언어가 아니지만 DOM이 없으면 JavaScript 언어는 웹 페이지 작업을 수행할 수 없습니다. JavaScript를 사용하여 웹 페이지에서 수행하는 모든 작업은 DOM을 통해 수행됩니다.

다음은 JavaScript와 DOM의 차이점을 보다 직관적으로 표시하기 위한 코드입니다. 코드에서 빨간색으로 표시된 부분이 DOM입니다.

var Tags = document.getElementsByTagName("a");
for(var i = 0; I , JavaScript의 핵심인 DOM, 그리고 각각이 어떤 역할을 하는지 한눈에 알 수 있습니다. (코드는 여기서 설명하지 않습니다.)
그러므로 대략적인 방정식이 있습니다:
웹 또는 XML 페이지 = DOM + JS(스크립팅 언어)

【추천 학습:

javascript 고급 튜토리얼

위 내용은 JavaScript와 dom의 관계는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.