如何使用jquery向现有div添加文本
如何使用jquery向现有div添加文本
提问于 2013-03-23 06:46:23
当我单击id为#add的按钮时，我想将文本添加到现有的div中。但这是行不通的。
下面是我的代码：
$(function () {
$('#Add').click(function () {
$('<p>Text</p>').appendTo('#Content');
});
}); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="Content">
<button id="Add">Add</button>
</div>
我希望你能帮助我。
回答 6
Stack Overflow用户
回答已采纳
发布于 2013-03-23 06:51:26
您需要定义按钮文本，并为按钮提供有效的HTML。我还建议使用.on作为按钮的单击处理程序
$(function () {
$('#Add').on('click', function () {
$('<p>Text</p>').appendTo('#Content');
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="Content">
<button id="Add">Add Text</button>
</div>
另外，我要确保jquery位于页面的底部，恰好在结束</body>标记之前。这样做将使您不必将所有内容都包装在$(function中，但我仍然会这样做。让你的javascript在页面的末尾加载，这样页面的其余部分就会加载，以防你的javascript在某个地方变慢了。
Stack Overflow用户
发布于 2013-03-23 06:51:22
运行示例：
//If you want add the element before the actual content, use before()
$(function () {
$('#AddBefore').click(function () {
$('#Content').before('<p>Text before the button</p>');
});
});
//If you want add the element after the actual content, use after()
$(function () {
$('#AddAfter').click(function () {
$('#Content').after('<p>Text after the button</p>');
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<div id="Content">
<button id="AddBefore">Add before</button>
<button id="AddAfter">Add after</button>
</div>
Stack Overflow用户
发布于 2013-03-23 06:49:19
您的html无效，button不是空标记。试一试
<div id="Content">
<button id="Add">Add</button>
</div> 页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15581059
复制相关文章
相似问题
腾讯云开发者
