JavaScript getElementById

Javascript — 03 November 2009

JavaScript getElementById ใช้ในการตรวจสอบหรือหา Control หรือ Html Element ภายใน Form ของ HTML โดยที่ getElementById สามารถหาตรวจสอบ id ทั้งหมดที่อยู่ภายใน Form

Syntax

document.getElementById(‘element-id’);

Code

01.<html>
02.<head>
03.<title>ThaiCreate.Com Tutorial</title>
04.</head>
05.<body>
06.<script language="javascript">
07.
08. function fncShowHideInput(value)
09. {
10. var input1 = document.getElementById('txtName1');
11. var input2 = document.getElementById('txtName2');
12. if(value.checked)
13. {
14. input1.style.display='none';
15. input2.style.display='none';
16. }
17. else
18. {
19. input1.style.display='';
20. input2.style.display='';
21. }
22. }
23.
24. function fncShowHideTable(value)
25. {
26. var idTb = document.getElementById('tbMain');
27. if(value.checked)
28. {
29. idTb.style.display='none';
30. }
31. else
32. {
33. idTb.style.display='';
34. }
35. }
36.</script>
37.
38.<form name="form1" method="post" action="">
39. <input type="checkbox" name="chkShowInput" value="Y" OnClick="JavaScript:fncShowHideInput(this);">
40. <input type="text" name="txtName" id="txtName1" value="">
41. <input type="text" name="txtName" id="txtName2" value="">
42. <br><br>
43. <input type="checkbox" name="chkShowTable" value="Y" OnClick="JavaScript:fncShowHideTable(this);">
44. <table width="26%" border="1" id="tbMain">
45. <tr>
46. <td>ThaiCreae.Com</td>
47. </tr>
48. </table>
49.</form>
50.</body>
51.</html>

เพิ่มเติม
นอกจากนี้ยังสามารถใช้ getElementByName() ซึ่งใช้ในการอ่าน name=”element-name”

document.getElementByName(‘element-name’);

Related Articles

Share

About Author

admin

(0) Readers Comments

Comments are closed.