1:下面是动态删除页面内容

效果:

没删除前:

0818b9ca8b590ca3270a3433284dd417.png

删除后:

0818b9ca8b590ca3270a3433284dd417.png

我们可以看见段落二被删除了

javascript代码:

function remove()

{

var p2 = document.getElementById("p2");

p2.parentNode.removeChild(p2);

}

window.onload = function()

{

var btn1 = document.getElementById("btn1");

btn1.onclick = remove;

}

html代码:

/p>

"http://www.w3.org/TR/html4/strict.dtd">

testdelete

我是段落一

我是段落二

我是段落三

我是段落四

我是段落五

2:动态增加页面内容和删除页面内容

0818b9ca8b590ca3270a3433284dd417.png

点击增加后:

0818b9ca8b590ca3270a3433284dd417.png

点击删除后:

0818b9ca8b590ca3270a3433284dd417.png

html代码:

/p>

"http://www.w3.org/TR/html4/strict.dtd">

js代码:

function add()

{

var f1 = document.getElementById("f1");

var parent = f1.parentNode;

var newf = document.createElement("input");

newf.setAttribute("type","file");

var br1 = document.createElement("br");

var br2 = document.createElement("br");

var btn = document.createElement("input");

btn.setAttribute("type","button");

btn.setAttribute("value","删除上传域");

btn.onclick = remove;

parent.insertBefore(newf,f1);

parent.insertBefore(btn,f1);

parent.insertBefore(br1,f1);

parent.insertBefore(br2,f1);

}

function remove()

{

var a = document.getElementsByTagName("input");

var b = document.getElementsByTagName("br");

if(b.length>0)

{

b[0].parentNode.removeChild(b[0]);

}

for(var i = 0;i

{

if(a[i].type="file")

{

a[i].parentNode.removeChild(a[i]);

break;

}

}

a = document.getElementsByTagName("input");

for(var i = 0;i

{

if(a[i].type="button")

{

a[i].parentNode.removeChild(a[i]);

break;

}

}

}

window.onload = function()

{

var btn1 = document.getElementById("btn1");

btn1.onclick = add;

}

Logo

Agent 垂直技术社区,欢迎活跃、内容共建。

更多推荐