原生JS操作DOM

可以通过htmldom访问javascripthtml文档的所有元素。当加载网页时，浏览器会创建页面的文档对象模型（DocumentObjectModel）。通过可编程对象模型，JavaScript获得了创建动态HTML的足够能力。JavaScript可以改变页面中所有的HTML元素JavaScript可以改变页面中所有的HTML属性JavaScript可以改变页面中所有的CSS样式JavaScript可以响应页面中的所有事件我们需要通过javascript来操作html元素找到这些html元素那里三种方法：1.通过id查找：vardoc=document.getElementById("idName");2.按标签名查找：vardoc=document.getElementsByTagName("tagName");3.按类名查找：vardoc=document.getElementsByClassName("className");htmldom允许javascript更改html元素的内容。1.更改html输出流在javascript中，可以使用document.write()直接将内容写入html输出流。提示：切勿在文档加载后使用document.write()。这将覆盖文档。2.更改html内容修改html内容最简单的方法是使用innerHTML属性。如：document.getElementById(idName).innerHTML="textcontent"3.更改html属性document.getElementById(id).attribute='新值'，如：document.getElementById(idName).src='location.png'htmldom允许javascript改变html元素的样式。document.getElementById(id).style.property=新样式，如：document.getElementById(idName).style.color="red";htmldom使javascript能够对html事件做出反应。可以使用事件属性，如：click也可以使用javascript给html元素赋值，如：document.getElementById("idName").onclick=功能（）{...};添加和删??除节点（HTML元素）。（重点复习内容）如果需要在htmldom中添加一个新的元素，首先要添加一个元素节点，然后在该元素上追加一个元素节点。varpara=document.createElement("p");varnode=document.createTextNode("这是一个新段落。");para.appendChild(node);varelement=document.getElementById("div1");元素。appendChild（段落）；上面的操作分为三步：1.新建一个

元素2.新建一个文本节点3.在已有元素上添加新元素元素，如：vareleNode=document.createTextNode('Thisisanewparagraph');document.getElementById('div1').appendChild(eleNode);常用的dom对象方法：在htmldom（文档对象模型）中，每一部分都是一个节点：文档本身就是一个文档节点，所有的HTML元素都是元素节点，所有的HTML属性都是属性节点，HTML元素中的文本是文本节点,comments是注释节点在htmldom中，element对象代表html元素，下面的属性和方法在所有的HTML元素上都有。