HTML DOM innerHTMLคุณสมบัติ
ตัวอย่าง
เปลี่ยนเนื้อหา HTML ขององค์ประกอบ <p> ด้วย id="demo":
document.getElementById("demo").innerHTML = "Paragraph changed!";
ตัวอย่าง "ลองใช้เอง" เพิ่มเติมด้านล่าง
ความหมายและการใช้งาน
ชุดคุณสมบัติ innerHTML หรือส่งคืนเนื้อหา HTML (HTML ภายใน) ขององค์ประกอบ
รองรับเบราว์เซอร์
Property | |||||
---|---|---|---|---|---|
innerHTML | Yes | Yes | Yes | Yes | Yes |
ไวยากรณ์
ส่งคืนคุณสมบัติ innerHTML:
HTMLElementObject.innerHTML
ตั้งค่าคุณสมบัติ innerHTML:
HTMLElementObject.innerHTML = text
มูลค่าทรัพย์สิน
Value | Description |
---|---|
text | Specifies the HTML content of an element |
รายละเอียดทางเทคนิค
คืนมูลค่า: | สตริง แทนเนื้อหา HTML ขององค์ประกอบ |
---|
ตัวอย่างเพิ่มเติม
ตัวอย่าง
รับเนื้อหา HTML ของ <p> องค์ประกอบที่มี id="myP":
var x = document.getElementById("myP").innerHTML;
ตัวอย่าง
รับเนื้อหา HTML ขององค์ประกอบ <ul> ด้วย id="myList":
var x = document.getElementById("myList").innerHTML;
ตัวอย่าง
เปลี่ยนเนื้อหา HTML ของสององค์ประกอบ:
document.getElementById("myP").innerHTML = "Hello Dolly.";
document.getElementById("myDIV").innerHTML = "How are you?";
ตัวอย่าง
แจ้งเตือนเนื้อหา HTML ขององค์ประกอบ <p> ด้วย id="demo":
alert(document.getElementById("demo").innerHTML);
ตัวอย่าง
ลบเนื้อหา HTML ของ <p> องค์ประกอบที่มี id="demo":
document.getElementById("demo").innerHTML = ""; // Replaces the content of <p> with an empty string
ตัวอย่าง
เปลี่ยนเนื้อหา HTML, URL และเป้าหมายของลิงก์:
document.getElementById("myAnchor").innerHTML = "W3Schools";
document.getElementById("myAnchor").href = "https://www.w3schools.com";
document.getElementById("myAnchor").target = "_blank";
❮ วัตถุธาตุ