문서의 객체를 배열로 가져올 수 있다.
<!DOCTYPE html>
<html>
<head>
<title>Index</title>
<script>
window.onload = function () {
// 문서 객체를 가져옵니다.
var headers = document.getElementsByTagName('h1');
for (var i = 0; i < headers.length; i++) {
// 문서 객체의 속성을 변경합니다.
headers[i].innerHTML = 'With getElementsByTagName()';
}
};
</script>
</head>
<body>
<h1>Header</h1>
<h1>Header</h1>
</body>
</html>
h1 태그안의 내용이 바뀌는 것을 볼 수 있을 것이다. 그리고 문서 객체 배열에서는 for in 반복문을 사용하면 안된다. 그러면 문서 객체 이외의 속성에도 접근하기 때문이다.
<!DOCTYPE html>
<html>
<head>
<title>Index</title>
<script>
window.onload = function () {
// 문서 객체를 가져옵니다.
var headers = document.getElementsByTagName('h1');
// 출력합니다.
var output = '';
for (var i in headers) {
output += i + '\n';
}
alert(output);
};
</script>
</head>
<body>
<h1>Header</h1>
<h1>Header</h1>
</body>
</html>
실행하면 브라우저에 따라 출력되는 종류와 갯수에 차이가 있을 것이다.
'Javascript' 카테고리의 다른 글
| 문서 객체와 객체지향을 이용한 움직임 구현 (0) | 2012.07.09 |
|---|---|
| 문서 객체를 이용한 움직임 구현 (0) | 2012.07.09 |
| IE에서 innerHTML로 내용을 바꿀 수 없는 태그들 (0) | 2012.07.06 |
| BOM(Brower Object Model: 브라우저 객체 모델) (0) | 2012.07.06 |
| Array 객체의 요소 제거 (0) | 2012.07.06 |