getElementsByTagName
Coddy의 JavaScript DOM 메서드 코스 레슨 — 13개 중 7번째.
getElementsByTagName() 함수는 일치하는 HTML 태그 이름(예: div, p, span)을 가진 모든 요소의 배열을 반환하여, 페이지 전체에서 특정 유형의 요소를 대상으로 지정할 수 있게 해줍니다. 이 함수는 getElementsByClassName() 함수와 정확히 동일하게 작동합니다.
const paragraphs = document.getElementsByTagName("p");이것이 paragraphs 변수에 모든 p 태그를 가져오는 방법입니다. 모든 단락을 변경하려면 이 변수를 반복(iterate)해야 합니다.
챌린지
쉬움HTML 코드가 주어집니다.
JavaScript만 사용하여, 모든 단락이 “Updated text”라는 텍스트를 가지도록 수정하세요.
직접 해보기
<!DOCTYPE html>
<html>
<body>
<h1>Welcome to Random HTML!</h1>
<p>This is a randomly generated HTML file. Here's a mix of different elements:</p>
<ul>
<li>This is an unordered list item.</li>
<li>This is another unordered list item.</li>
</ul>
<p>Below are the four randomly generated paragraphs:</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquet ligula sit amet convallis sodales.</p>
<p>Nulla facilisi. Nulla eget metus vitae ligula aliquam rhoncus.</p>
<p>Maecenas feugiat ultricies nisi, id auctor purus laoreet at.</p>
<p>Curabitur vitae dictum arcu, ac fermentum ligula. Duis feugiat arcu non tincidunt posuere.</p>
<blockquote>
<p>This is a blockquote. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</blockquote>
<p>Thank you for exploring this random HTML file!</p>
<script src="script.js"></script>
</body>
</html>