home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

HTML DOM อ้างอิงวัตถุ

ออบเจ็กต์อ้างอิง HTML DOM เชื่อมโยงกับองค์ประกอบ HTML องค์ประกอบ ใช้เพื่ออ้างอิงถึงงานสร้างสรรค์ที่อ้างถึงและต้องรวมชื่อไว้ด้วย ไม่ว่าจะเป็นภาพวาด หนังสือ รายการทีวี ภาพยนตร์ เป็นต้น

ไวยากรณ์

ต่อไปนี้เป็นไวยากรณ์สำหรับ −

การสร้างวัตถุอ้างอิง -

var x = document.createElement("CITE");

ตัวอย่าง

ให้เราดูตัวอย่างของวัตถุอ้างอิง HTML DOM -

<!DOCTYPE html>
<html>
<body>
<p>Click the below button to create a CITE element.</p>
<button onclick="createCite()">CREATE</button><br><br>
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-
_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-
_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">
<script>
   function createCite() {
      var x = document.createElement("CITE");
      var t = document.createTextNode("The Starry night.");
      x.appendChild(t);
      document.body.appendChild(x);
   }
</script>
</body>
</html>

ผลลัพธ์

สิ่งนี้จะสร้างผลลัพธ์ต่อไปนี้ -

HTML DOM อ้างอิงวัตถุ

คลิก “สร้าง” –

HTML DOM อ้างอิงวัตถุ

ในตัวอย่างข้างต้น เราได้แทรกรูปภาพโดยใช้แท็ก -

<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg/800px-Van_Gogh_-_Starry_Night_-_Google_Art_Project.jpg" width="220" height="277" alt="The Starry night">

เราได้สร้างปุ่ม CREATE เพื่อรันเมธอด createCite() -

<button onclick="createCite()">CREATE</button>

createCite() วิธีการสร้าง องค์ประกอบและกำหนดให้กับตัวแปร x โหนดข้อความที่มีข้อความบางส่วนถูกสร้างขึ้นและกำหนดให้กับตัวแปร t จากนั้นโหนดข้อความจะถูกผนวกเข้ากับองค์ประกอบ โดยใช้วิธี appendChild() บนตัวแปร x จากนั้นองค์ประกอบ พร้อมกับโหนดข้อความจะถูกผนวกเข้ากับเนื้อหาเอกสารโดยใช้เมธอด appendChild() บนเนื้อหาของเอกสาร