DOM & JS DIV层操作_创造，指定删除，全部删除
DOM & JS DIV层操作_创造，指定删除，全部删除
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title <script src="temp.js" type="text/javascript" $amp;>amp;$lt;/script></head>
<body>
<div>
<span>
<input type="text" id="text" name="mytest" /></span>
<span>
<input type="submit" value="add" id="submit" onclick="addDIV(document.getElementById('text').value);" /></span>
<span>
<input type="submit" value="delete" id="submit" onclick="deleteDIV(document.getElementById('text').value);" /></span>
<span>
<input type="submit" value="delete" id="submit2" onclick="deleteAllDIV();" /></span>
<div>male
<input type="radio" name="nametest" value="good" checked="checked" />female
<input type="radio" name="nametest" value="bad" /></div>
<div>temp1
<input type="checkbox" name="nametest2" value="temp1" checked="checked" />temp2
<input type="checkbox" name="nametest2" value="temp2" /></div>
<div id="add"></div>
</body>
</html>
<script>function addDIV(addText) {
/*创建新层*/
var div_view = document.createElement("div");
var text = document.getElementById("add");
div_view.id = addText;
div_view.innerText = addText;
text.appendChild(div_view);
}
function deleteDIV(id) {
/*删除一个层*/
var temp = document.getElementById(id);
temp.parentNode.removeChild(temp);
}
function deleteAllDIV() {
/*删除所有附加层*/
var parent = document.getElementById("add"); //这里因为childNodes节点会动态变下标，所以用0的index实现全部删除
for (var i = 0, length= parent.childNodes.length; i< length; i++){ parent.removeChild(parent.childNodes[0]); };
}</script>
您阅读这篇文章共花了：
相关文章
本文作者：起点终站
文章标题： DOM & JS DIV层操作_创造，指定删除，全部删除
本文地址：https://blog.hellozwh.com/?post=158
版权声明：若无注明，本文皆为“起点终站”原创，转载请保留文章出处。
本文地址：https://blog.hellozwh.com/?post=158
版权声明：若无注明，本文皆为“起点终站”原创，转载请保留文章出处。
扫一扫微信二维码
一般人我不告诉他
标签
网站统计
