JQuery中点击一次添加按钮，增加一个div的思路如下
给按钮注册一个点击的监听事件
在监听器中创建一个div元素附加在一个html元素后面
示例代码如下
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<style type="text/css">
#father
{
width:150px
height:150px
background-color:red
}
#father div
{
width:50px
height:50px
background-color:green
font-size:12px
}
</style>
<script type="text/javascript" src="/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
})
//father元素后面增加一个div元素
$("#father").prepend("<div>新的div</div>")
})
</script>
</head>
<body>
<input type="button" value="增加div" id="btn">
<div id="father"></div>
</body>
</html>
append()方法是在指定元素的“结尾”添加指定内容，你在“body”之后用append()，也就是把要添加的内容写在body之外了，而页面上显示的都是body内部的内容呀，当然看不到了。修改的方法就是在body内部随便定义一个div，然后选中这个div用append()就可以了。
这不是固定死的内容格式吗1234567891011121314151617181920212223242526272829303132333435363738394041424344454647<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title><script src="jquery-1.8.3.min.js" type="text/javascript"></script></head><body><input type="button" value="插入" onclick="add(1)"/><input type="button" value="复制" onclick="add(2)"/><input type="button" value="替换" onclick="add(3)"/><input type="button" value="删除" onclick="add(4)"/><input type="button" value="格式" onclick="add(5)"/><div id="content"></div><div id="text" style="display:none"><p>春眠不觉晓</p><p>处处闻啼鸟</p><p>夜来风雨声</p><p>花落知多少</p></div><script>function add(str){switch(str){case 1:$("#content").html($("#text").html())breakcase 2:$("#content").append($("#text").html())//以下两种方式任选 添加一个隐藏的div，或者直接写死在上面breakcase 3:$("#content").html("<p>春眠不觉晓</p><p>处处闻啼鸟</p><div>夜来风雨声</div><p>花落知多少</p><p>春眠不觉晓</p><p>处处闻啼鸟</p><p>夜来风雨声</p><p>花落知多少</p>")breakcase 4:$("#content").html("<p>春眠不觉晓</p><p>处处闻啼鸟</p><div>夜来风雨声</div><p>花落知多少</p><p>春眠不觉晓</p><p>处处闻啼鸟</p>")breakcase 5:$("#content").css("color","blue")breakdefault:break}}</script></body><script></script></html>
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）