การอ้างถึงตัวเอง
ใช้คำสั่ง this สำหรับอ้างถึงตัวเอง
ตัวอย่างข้างล่างนี้ onclick="this.style.background='red';" หมายถึง เมื่อคลิกปุ่มนี้ ให้เปลี่ยนสีพื้นหลังโดยใช้คำสั่ง style sheet ให้เป็นสีแดง
<input type="button" value="คลิกเพื่อเปลี่ยนสีปุ่ม" onclick="this.style.background='red';">
ผลลัพธ์การอ้างถึง Object ต่างๆ โดยใช้ ID
ทำได้โดยใช้ document.getElementById หรือ ระบุ id ของ Object เลยก็ได้
จากตัวอย่าง คลิกปุ่มทดสอบ แล้วดึงค่าจาก Textbox มาแสดงใน Alert
<input id="txtID1" type="text" value="ทดสอบ 1">
<input name="txtName1" type="text" value="ทดสอบ 1">
<input type="button" value="ทดสอบ" onclick="alert(document.getElementById('txtID1').value);">
<input type="button" value="ทดสอบ" onclick="alert(txtID1.value);">
<input type="button" value="ทดสอบ" onclick="alert(txtName1.value);">
ผลลัพธ์ถ้า Object มี id มากกว่า 1 ตัว และใช้ document.getElementById จะอ้างถึง Object ตัวแรก แต่ถ้าระบุ id โดยตรงจะะไม่สามารถหาค่าได้ ดังตัวอย่าง
<input id="txtID2" type="text" value="ทดสอบ 2.1">
<input id="txtID2" type="text" value="ทดสอบ 2.2">
<input type="button" value="ทดสอบ" onclick="alert(document.getElementById('txtID2').value);">
<input type="button" value="ทดสอบ" onclick="alert(txtID2.value);">
ผลลัพธ์การอ้างถึง Object ต่างๆ ใน Form โดยใช้ ID และ Name
ถ้า Object มี id ซ้ำกันมากกว่า 1 ตัว จะอ้างถึง Object ไม่ได้
ถ้า Object มี name ซ้ำกันมากกว่า 1 ตัว จะอ้างถึง Object ไม่ได้
ถ้า Object มี id และ name ซ้ำกันมากกว่า 1 ตัว จะอ้างถึง Object ไม่ได้
ดังตัวอย่าง
<form name="form3">
<input id="txtID3" type="text" value="ทดสอบ 3.1">
<input id="txtID3" type="text" value="ทดสอบ 3.1">
<input type="button" value="ทดสอบ" onclick="alert(document.form3.txtID3.value);">
<br>
<input name="txtName3" type="text" value="ทดสอบ 3.2">
<input name="txtName3" type="text" value="ทดสอบ 3.2">
<input type="button" value="ทดสอบ" onclick="alert(document.form3.txtName3.value);">
<br>
<input id="txt3" type="text" value="ทดสอบ 3.2">
<input name="txt3" type="text" value="ทดสอบ 3.2">
<input type="button" value="ทดสอบ" onclick="alert(document.form3.txt3.value);">
</form>ผลลัพธ์