【dom】javascript dom 基本操作小结-基本操作

欢迎您访问我爱IT技术网，今天小编为你分享的javascript教程：【javascript dom 基本操作小结】，下面是详细的讲解！

javascript dom 基本操作小结

自己平时可能也会经常遇到所以总结如下：
1，dom元素的创建
2，dom元素的插入
3，dom元素替换
4，dom元素的删除

首先页面上有这么些简单的dom元素
<div id="wrap">
　　<div id="a">aaaaaaaa</div>
　　<div id="b">bbbbbbbb</div>
　　<div id="c">ccccccccc</div>
</div>
接下来我们创建一个div元素，js代码：
var div_d=document.createElement('div');
div_d.innerHTML="dddddddd";
div_d.id="d";
//这里不用innerText为了避免浏览器兼容引发一些问题；
然后把创建的这个id为d 的div插到dom元素id为b的div的前面
var div_wrap=document.getElementById('wrap');
var div_b=document.getElementById('b');
div_wrap.insertBefore(div_d,div_b);
如果直接插到id为wrap的子元素后面则可以这样：
div_wrap.insertBefore(div_d,null);

如果是替换掉div_b则如下：
div_wrap.replaceChild(div_d,div_b);
最后我们删除指定的一个元素id为b的div
div_b.parentNode.removeChild(div_b);
或者
document.body.removeChild(div_b);
后续可能有很多衍生的方法及应用这里暂时不继续写下去了

关于javascript dom 基本操作小结的用户互动如下：

　　相关问题：javascript dom操作

　　答：document.getElementById("myform").name="myform"; >>详细

　　相关问题：JS里面的DOM操作是什么

　　答：DOM(即 Document Object Mode) 是 W3C（万维网联盟）的标准。 DOM 定义了访问 HTML 和 XML 文档的标准：“W3C 文档对象模型 （DOM） 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。” W3C DOM 标准被分为 3... >>详细

　　相关问题：java web 教程里的一个javascript操作dom的例子，...

　　答：新的编号： 新的姓名： >>详细