JavaScript에서 클래스 이름으로 요소를 어떻게 선택합니까?

클래스 이름으로 요소를 얻는 방법

JavaScript에서 document.getElementById() 메서드를 사용하면 ID로 요소를 검색하는 것이 간단합니다. 그러나 클래스별로 요소를 가져오는 방법은 약간 다르며 처음에는 혼란을 일으킬 수 있습니다.

클래스별로 요소를 선택하는 올바른 메소드 이름은 document.getElementsByClassName()입니다. 이는 웹 페이지의 여러 요소가 동일한 클래스를 공유할 수 있기 때문에 NodeList 또는 유사 배열 객체를 반환하는 'Elements'를 사용하기 때문입니다.

예는 다음과 같습니다.

<code class="javascript">var elementsByClass = document.getElementsByClassName('class_name');
console.log(elementsByClass[0]); // Accesses the first element with the provided class name</code>

NodeList를 실제 배열로 변환해야 하는 경우 다음 방법을 사용할 수 있습니다.

<code class="javascript">var arrayFromList1 = Array.prototype.slice.call(elementsByClass);

// Alternatively, you can use the following syntax to convert the NodeList to an array
var arrayFromList2 = [].slice.call(elementsByClass);</code>

가치가 있습니다. 클래스별로 요소를 선택하려면 querySelector() 또는 querySelectorAll()을 사용하는 것이 일반적으로 더 나은 크로스 브라우저 지원으로 인해 선호됩니다.

마지막으로 정확하고 최신 정보를 얻으려면 MDN과 같은 평판이 좋은 소스를 참조하는 것이 좋습니다. 날짜 JavaScript 정보입니다.

위 내용은 JavaScript에서 클래스 이름으로 요소를 어떻게 선택합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!