hrming
[JavaScript] DOM (Document Object Model) 본문
1. DOM (Document Object Model)
: 자바스크립트가 HTML에 대한 정보들 (id, class, name, style, innerHTML 등)을 object 자료로 정리한 것
2. 브라우저는 HTML 문서를 위에서 부터 읽으며 DOM을 생성
: DOM이 생성된 경우에만 HTML을 변경할 수 있음.
<script>
document.getElementById('test').innerHTML = 'Changed'
</script>
<p id="test"> Previous </p>
// DOM이 생성된 경우에만 HTML을 변경할 수 있음
// p태그에 대한 DOM이 생성되지 않았기 때문에, HTML 변경 불가. 에러 발생.
3. 자바스크립트 실행을 미루는 방법
: 자바스크립트를 <body>태그 끝나기 전에 작성하면 상관 없지만, 자바스크립트 위치를 정할 수 없을 경우 사용
$(document).ready(function(){ TEST })
document.addEventListener('DOMContentLoaded', function() { TEST })
// 'HTML을 다 읽어들였는지'를 알려주는 이벤트리스너
출처: 코딩애플
'JavaScript' 카테고리의 다른 글
[JavaScript] Table에서 선택한 행의 값 가져오기 (0) | 2024.03.06 |
---|---|
[JavaScript] 브라우저 저장공간 (0) | 2024.02.12 |
[JavaScript] 빈 값 ( null / undefined / NaN ) (0) | 2024.02.11 |
[JavaScript] getElementById & querySelector 차이 (0) | 2024.02.11 |
[JavaScript] 정규식 (1) | 2024.01.30 |
Comments