- slide 1 of 23, currently active
- slide 2 of 23
- slide 3 of 23
- slide 4 of 23
- slide 5 of 23
- slide 6 of 23
- slide 7 of 23
- slide 8 of 23
- slide 9 of 23
- slide 10 of 23
- slide 11 of 23
- slide 12 of 23
- slide 13 of 23
- slide 14 of 23
- slide 15 of 23
- slide 16 of 23
- slide 17 of 23
- slide 18 of 23
- slide 19 of 23
- slide 20 of 23
- slide 21 of 23
- slide 22 of 23
- slide 23 of 23
12.3.1 콘텐츠 조작하기
선택한 노드의 타입이 요소 노드라면 다음 표에 정의된 속성을 사용해 콘텐츠를 조작할 수 있습니다.
표 12-5 요소 노드의 콘텐츠 조작 속성
|
속성 |
설명 |
|
textContent |
요소 노드의 모든 텍스트에 접근합니다. |
|
innerText |
요소 노드의 텍스트 중 웹 브라우저에 표시되는 텍스트에만 접근합니다. |
|
innerHTML |
요소 노드의 텍스트 중 HTML 태그를 포함한 텍스트에만 접근합니다. |
예를 들어, 다음과 같은 HTML 코드가 있습니다.
12/03/content.html
<p id="title">Hello, <span style="display:none;">Javascript!</span></p>
이 코드를 표 12-5에 나온 콘텐츠 조작 속성으로 접근했을 때 각 속성이 가져오는 콘텐츠는 다음과 같습니다.
document.getElementById("title").textContent; // Hello, Javascript!
document.getElementById("title").innerText; // Hello,
document.getElementById("title").innerHTML; // Hello, <span style="display: none;">Javascript!</span>