JS获取元素总结以及JS增删改元素

一、获取元素总结：

（1） document是一个js对象，用于表示当前html网页。当浏览器加载完整个html网页后，会用document对象表示整个html网页！

（2） document.getElementById( id值 ) -- 通过元素的id值，获取一个元素。返回的是表示该元素的js对象。

     <div id="div1">一个div</div>
    //获取id为div1的元素
    var oDiv1 = document.getElementById("div1");
    //oDiv1是一个js对象,表示获取的div元素

（3） document.getElementsByTagName( 元素名 ) -- 通过元素名称获取当前文档中的所有指定名称的元素，返回的是一个数组，其中包含了所有指定名称的元素。

（4） document.body -- 获取当前文档中的body元素

（5） element.parentNode -- 获取当前元素的父元素。element表示当前元素。

 

二、增删元素

（1）document.createElement( 元素名称 ) -- 根据元素名称创建指定名称的元素，返回的是表示新创建元素的js对象

（2）parent.appendChild( child ) -- 通过父元素添加子元素，其中parent表示父元素，child表示子元素

（3）parent.removeChild( child )-- 通过父元素删除子元素，其中parent表示父元素，child表示子元素

（4）element.innerHTML -- 获取当前元素的html内容(从开始标签到结束标签之间的所有内容)，还可以设置当前元素的html内容(如果元素内部有内容，将会覆盖原有内容)

代码实例：<div id="div1">
                      这是一个div元素...
                    <span>这是一个span元素</span>
               </div>
                    //获取div元素
                   var oDiv1 = document.getElementById("div1");
                   oDiv1.innerHTML;//获取div元素的内容