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

ออบเจ็กต์ HTML DOM DFN


ออบเจ็กต์ DFN ของ HTML DOM เกี่ยวข้องกับองค์ประกอบ HTML <dfn> ข้อความภายในองค์ประกอบ <dfn> คือข้อความที่ถูกกำหนดความหมายในบริบทรอบข้าง ออบเจ็กต์ DFN แทนองค์ประกอบ <dfn>

ไวยากรณ์ (Syntax)

var p = document.createElement("DFN");

ตัวอย่าง (Example)

<!DOCTYPE html> <html> <body> 
<h2>DFN object example</h2> 
<p>Click the below button to create a dfn element with some text inside it.</p> 
<button onclick="dfnCreate()">CREATE</button> 
<br><br> 
<script> 
  function dfnCreate() { 
    var x = document.createElement("DFN"); 
    var t = document.createTextNode("The definition element"); 
    x.appendChild(t); 
    document.body.appendChild(x); 
  } 
</script> </body> </html>

ผลลัพธ์ (Output)

ผลลัพธ์ที่ได้:

ออบเจ็กต์ HTML DOM DFN

เมื่อคลิกปุ่ม CREATE:

ออบเจ็กต์ HTML DOM DFN

คำอธิบายโค้ด

สร้างปุ่ม CREATE ทำงาน dfnCreate() เมื่อคลิก:

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

dfnCreate() สร้างองค์ประกอบ <dfn> ด้วย createElement() สร้าง text node ด้วย createTextNode() เพิ่ม text node เป็นลูกของ <dfn> แล้วเพิ่ม <dfn> พร้อม text node เป็นลูกของ document body:

function dfnCreate() { 
  var x = document.createElement("DFN"); 
  var t = document.createTextNode("The definition element"); 
  x.appendChild(t); 
  document.body.appendChild(x); 
}