一、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>