您的位置：首页 > Web前端 > HTML

DOM对HTML元素的增删改操作

2017-12-08 10:17 190 查看

DOM创建节点的方法

document.createElement(Tag)，Tag必须是合法的HTML元素

DOM复制节点的方法

节点.cloneNode(boolean deep),当deep为true时，表示复制当前节点以及当前节点全部后代节点。为false，只复制当前节点。

<html>
<head>
<title>00</title>
<script type="text/javascript" charset="utf-8">

function create(){
var city=document.getElementById("city");
var element=document.createElement("li");
element.innerHTML="南京";
//city.appendChild(element);
//city.insertBefore(element,city.firstChild.nextSibling);
city.replaceChild(element,city.lastChild.previousSibling);
}

function copy(){
var city=document.getElementById("city");
var element=city.firstChild.nextSibling.cloneNode(false);
city.appendChild(element);
}
function deletetest(){
var city=document.getElementById("city");
var element=city.firstChild.nextSibling;
city.removeChild(element);
}

</script>
</head>
<body>
<ul id="city">
<li>北京</li>
<li>上海</li>
</ul>

<input type="button" value="创建复制替换节点" onclick="create()"/>
<input type="button" value="复制节点" onclick="copy()"/>
<input type="button" value="删除节点" onclick="deletetest()"/>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： dom tag 增删改操作复制 javascript

相关文章推荐

新的分享

章节导航