JavaScript - 문제 미리보기

문제 779

easy
다음 jQuery 코드와 같은 기능을 하는 JavaScript 코드는?

```javascript
// jQuery
myElements = $("p");

// JavaScript
myElements = document.______("p");
```
A. getElementsByTag
B. getElementsByTagName
C. getElementByTag
D. selectByTagName

정답: B

태그명으로 요소를 선택하는 JavaScript의 표준 메서드입니다.

태그명 선택 비교:

jQuery 방식:
```javascript
var myElements = $("p"); // 모든 <p> 태그 선택
console.log(myElements.length); // 요소 개수
console.log(myElements[0].innerHTML); // 첫 번째 요소 내용
```

JavaScript 방식:
```javascript
var myElements = document.getElementsByTagName("p");
console.log(myElements.length); // 요소 개수
console.log(myElements[0].innerHTML); // 첫 번째 요소 내용
```

반환값의 특징:

• jQuery: jQuery 객체 반환 (jQuery 메서드 사용 가능)
• JavaScript: HTMLCollection 반환 (배열과 유사하지만 배열은 아님)

HTMLCollection 특성:
```javascript
const paragraphs = document.getElementsByTagName("p");
console.log(paragraphs.length); // 길이 확인
console.log(paragraphs[0]); // 인덱스로 접근
// paragraphs.forEach() // ❌ 작동하지 않음 (배열이 아니므로)

// 배열로 변환하려면:
const paragraphArray = Array.from(paragraphs);
paragraphArray.forEach(p => console.log(p.innerHTML)); // ✅ 작동
```

현대적 대안:
```javascript
// querySelectorAll 사용 (NodeList 반환, forEach 사용 가능)
const paragraphs = document.querySelectorAll("p");
paragraphs.forEach(p => console.log(p.innerHTML));
```

💡 학습 팁

이 문제를 포함한 JavaScript 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.