怎么实现点击添加按钮就生成一个新的Div_IT百科

<!DOCTYPE HTML>

<head>

<title>白菜编辑部</title>

</style>

$ (function ()

{

$ ('button').click (function ()

{

$('body').append('<div>11</div>')

})

</script>

</head>

<body>

<button>添加div</button>

</body>

</html>

<body>

var btn = document.getElementById("btn")

var divs = document.getElementsByTagName("div") //DIV数组

var index = divs.length-1 //得到最后一个DIV索引

btn.onclick=function(){

var divi = document.createElement("div") //创建一个DIV

var txt = document.createTextNode("第"+(divs.length+1)+"个DIV") //创建DIV的文字内容

divi.appendChild(txt) //将文字内容添加到新创建的DIV

divs[index].appendChild(divi) //将新创建的DIV添加到原来最后一个DIV的后面

}

</script>

</body>

看下效果

利用jq的append()追加函数即可实现，如：

html：

</div>

JQ：

$(document).ready(function(){

$(".btn").click(function(){

var html = '<div style="width:200px height:30px border:1px dashed red margin-bottom:20px"></div>'

$(".main").append(html)

})

欢迎分享，转载请注明来源：内存溢出

怎么实现点击添加按钮就生成一个新的Div