ในอดีตมีการใช้วิธี InnerHTML และ InnerText เพื่อเพิ่มเนื้อหา HTML และเนื้อหาข้อความ เมื่อเร็วๆ นี้ ฉันค้นพบว่ายังมีวิธี insertAdjacentHTML และ insertAdjacentText ทั้งสองวิธีนี้มีความยืดหยุ่นมากกว่าและสามารถแทรกเนื้อหา HTML และเนื้อหาข้อความในตำแหน่งที่ระบุได้
insertAdjacentHTML method: แทรกคำสั่งแท็ก html ที่ตำแหน่งที่ระบุ
Prototype: insertAdajcentHTML(swhere,stext)
พารามิเตอร์:
swhere: ระบุตำแหน่งที่จะแทรกคำสั่งแท็ก html มีอยู่ 4 ค่า:
1. beforeBegin: แทรกก่อนจุดเริ่มต้นของ tag
2. afterBegin: แทรกหลังแท็กเริ่มต้นของแท็ก
3. beforeEnd: แทรกก่อนแท็กปิดของแท็ก
4. afterEnd: แทรกหลังแท็กปิดของแท็ก
ข้อความ: เนื้อหาที่จะแทรก
DEOM:
<html>
<head >
<script language="javascript">
ฟังก์ชั่น myfun ()
{
var obj = document.getElementById("btn1");
obj.insertAdjacentHTML("afterEnd","<br><input name="txt1">") ;
}
</script>
</head>
< body>
<input name="txt">
<input id="btn1" name="btn1" type="button" value="more..." onclick="myfun ()">
</body>
</ html>