一，操作html
1.改变html的元素
2.改变html的属性
3.改变所有的html的CSS样式
4.对页面的所有事件作出反应
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <p id="hello">Hello World!!!!</p> <p id="hey">hahhahahahah</p> <input type="button" onclick="domdemo()" value="点击"/> <button onclick="domdemo2()">变标签</button> <script> function domdemo(){ document.getElementById("hello").innerHTML="卧槽！！"; //通过id的方法改变html元素的内容 } function domdemo1(){ //改变了html元素的样式的属性 document.getElementById("peace").style.color="green"; } function domdemo2(){ document.getElementsByTagName("h1").innerHTML="What up??man"; //通过获取标签的名字来改变， //如果有两个一样的标签的话，那么他只能改变第一个标签 } function domdemo3(){ document.getElementById("img").src="img/3.jpg"; } </script> <h1 id="peace" style="color: red;">世界和平！！！</h1> <button onclick="domdemo1()" >变身</button> <br /><br /> <img src="img/img3.jpg" id="img"/> <br /> <button onclick="domdemo3()">变大</button> <button id="dianji" >点击事件</button> <script> //通过id给按钮注册事件 //这里需要注意的是addEvenListener的参数， 第一个是事件的类型，第二个函数的名称 //这里的函数名称不需要括号 document.getElementById("dianji").addEventListener("click",demo); function demo(){ alert("伙计~ 你点击了我呢~"); } </script> </body> </html>
二，创建对象的几种不同的方法
<script>//方法一：使用new 一个object的对象 ，。然后赋值 people=new Object(); people.name="郑伟钊"; people.age="22"; document.write("name:"+people.name+"______age:"+people.age); </script> <br /> <script>//方法2：使用大括号方法，直接在里面赋对象的值 people1={name:"吴彦祖",age:"30"};//注意这里使用的是冒号 document.write("name:"+people1.name+"____age:"+people1.age); </script> <br /> <script> function people2(name,age)//方法3：利用new一个方法，创建这个方法的对象，在引用参数的使用记得使用"this."来对参数进行索引
{ this. _name=name;//这里需要用this来进行参数的索引， this._age=age; //后面还有一个点 . } son=new people2("周杰伦","35"); document.write("name:"+son._name+"____age:"+son._age); </script>
三，DOM对象控制HTML的相关的函数
方法如下：
getElementsByName() :获取name
getElementsTagName() :获取元素
getAttribute() ：获取元素的属性
setAttribute() :设置元素的属性
childNodes() :访问子节点
parentNode() :访问父节点
createElement () :创建父元素节点
createTextNode() :创建文本节点
i nsertBefore() :插入节点
removeChild() :删除节点
offsetHeight() ：网页尺寸
scrollHeight() :网页尺寸