First และ Last Child Node ของ Node เฉพาะใน JavaScript

เพื่อดึง First และ Last Child Nodes ของ Node เฉพาะ JavaScript มี firstChild และ lastChild Methods ตามลำดับ มาดูรายละเอียดกัน

FirstChild

Syntax

node.firstChild;

ตัวอย่าง

ในตัวอย่างนี้ มี 3 Elements ใน List Node ใช้ Method "firstChild" หา Element แรก และแสดงผลลัพธ์

<html> <body> <ul id = "list"><li>Tesla</li><li>Spacex</li><li>Solarcity</li></ul> <p id="first"></p> <script> var list = document.getElementById("list").firstChild.innerHTML; document.getElementById("first").innerHTML = list; </script> </body> </html>

ผลลัพธ์

Tesla Spacex Solarcity Tesla

LastChild

Syntax

node.lastChild;

ตัวอย่างที่ 2

ในตัวอย่างนี้ มี 3 Elements ใน List Node ใช้ Method "lastChild" หา Element สุดท้าย และแสดงผลลัพธ์

<html> <body> <ul id = "list"><li>Tesla</li><li>Spacex</li><li>Solarcity</li></ul> <p id="first"></p> <script> var list = document.getElementById("list").lastChild.innerHTML; document.getElementById("first").innerHTML = list; </script> </body> </html>

ผลลัพธ์

Tesla Spacex Solarcity Solarcity