English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
firstElementChild읽기 전용 속성은 지정된 부모 요소의 첫 번째 자식 요소를 반환합니다.
부모 요소에 자식 요소가 없으면, 이 메서드는null값을 설정합니다.
을 사용하여children속성을 사용하세요. children [0]는 firstElementChild와 같은 결과를 반환합니다.
지정된 부모 요소의 마지막 자식 요소를 반환하려면,lastElementChild속성.
ParentElement.firstElementChild
<div>
<p>이 DIV 중의 첫 번째 요소는1개 P</p>
<p>이 DIV 중의 첫 번째 요소는2개 P</p>
<p>이 DIV 중의 첫 번째 요소는3개 P</p>
</div>
<script>
var x = document.querySelector("div").firstElementChild.nodeName;
document.getElementById("result").innerHTML = x;
</script>테스트를 보세요‹/›모든 브라우저가 firstElementChild 속성을 완전히 지원합니다:
| 속성 | |||||
| firstElementChild | 는 | 는 | 는 | 는 | 는 |
| 반환 값: | 한 개의 Node 객체는 지정된 부모 요소의 첫 번째 자식 요소를 대표합니다. 자식 요소가 없으면,null |
|---|---|
| DOM 버전: | DOM 레벨1 |
DIV 요소의 첫 번째 자식 요소의 HTML 내용을 가져옵니다:
<div>
<p>이 DIV 중의 첫 번째 요소는1개 P</p>
<p>이 DIV 중의 첫 번째 요소는2개 P</p>
<p>이 DIV 중의 첫 번째 요소는3개 P</p>
</div>
<script>
var x = document.querySelector("div").firstElementChild.textContent;
document.getElementById("result").innerHTML = x;
</script>테스트를 보세요‹/›DIV 요소의 첫 번째 자식 요소의 HTML 내용을 변경합니다:
var div = document.querySelector("div");
div.firstElementChild.textContent = "HELLO WORLD";테스트를 보세요‹/›HTML DOM 참조:lastElementChild 속성