JS DOM 對象
一、DOM 分類
DOM 分為 window 對象 和 document 對象
二、函數調用
1 自己封裝的函數 調用只寫函數名（）；數學函數 math 或 絕對值 調用 寫 Math.abs()
2 函數和屬性的調用（不一樣）例如:
函數調用直接寫函數名 window.hanshu() ; 屬性調用直接寫屬性名字就可以 windows.shuxin() ;
三、什麽是事件
事件就事先設置好的程序，被觸發
document對象
1.找元素的方法
1.通過id名找
var d1 = document.getElementById("d1");
alert(d1);
2.通過class名找
var d2 = document.getElementsByClassName("d2");
alert(d2[1]);
3.標簽名找
var d3 = document.getElementsByTagName("div");
alert(d3[0]);
4.表單元素
var d4 = document.getElementsByName("d4");
alert(d4[0]);
操作
操作內容
1.獲取內容
var d1 = document.getElementById("d1");
alert(d1.innerText);
2.修改內容
d1.innerText = "<u>這是修改html代碼</u>";
alert(d1.innerHTML);
d1.innerHTML = "<u>這是修改html代碼</u>";
操作屬性
1.獲取屬性
var d3 = document.getElementById("d3");
alert(d3.getAttribute("id"));
2.添加屬性
d3.setAttribute("sd","1");
3.移除屬性
d3.removeAttribute("size");
操作樣式
var d1 = document.getElementById("d1");
1.獲取樣式
alert(d1.style.color);
2.修改樣式
d1.style.color = "red";
Window對象
1 <body> 2 3 <div style="width:200px; height:300px; background-color:#36F;" ondblclick="Show(this)"> 4 DOM 5 window對象 6 document對象 7 函數調用：自己封裝的函數調用只寫函數名();數學函數Math 絕對值 怎麽調用：Math.abs() 8 函數和屬性的調用: 9 window.hanshuming(); 函數 10 window.opener; 屬性 11 </div> 12 <input type="checkbox"/> 13 <input type="button" value="按鈕"/> 14 <select onchange="Show(this)"> 15 <option>111</option> 16 <option>222</option> 17 <option>333</option> 18 </select> 19 load(sender,e) sender:觸發源（誰觸發的事件） e：事件內容 20 { 21 22 } 23 <br /> 24 <input type="button" value="打開窗口" onclick="Dakai()"/> 25 <input type="button" value="關閉窗口" onclick="Guan()" /> 26 <input type="button" value="清除間隔" onclick="Qing()"/> 27 <input type="button" value="前進" onclick="Qian()" /> 28 <input type="button" value="打開" onclick="D()"/> 29 </body> 30 <script type="text/javascript"> 31 function Qian() 32 { 33 window.history.forward(); 34 } 35 function Show(i) 36 { 37 alert(i+"這是一個事件"); 38 } 39 //Show(1,2); 40 var d; 41 function Dakai() 42 { 43 if(d==null) 44 { 45 d = window.open("1.html","_self","width=300 height=200"); 46 } 47 48 } 49 50 function Guan() 51 { 52 d.close(); 53 } 54 //alert("sss"); 55 var q = window.setInterval("Jan()",2000); 56 function Jan() 57 { 58 alert("這是間隔"); 59 } 60 61 function Qing() 62 { 63 window.clearInterval(q); 64 } 65 66 function D() 67 { 68 window.location.href = "http://www.baidu.com"; 69 } 70 </script>
JS DOM 對象