Rumah > Artikel > hujung hadapan web > 如何使用jQuery中append方法添加元素
如何使用jQuery中append方法添加元素
- 不言asal
- 2018-12-28 17:35:096210semak imbas
append方法是一种可以动态添加html元素的方法，使用append方法非常方便，你可以在添加任意多少行html元素，本篇文章我们就来介绍关于append方法添加元素的方法。
如何使用append方法？
$(‘选择器’).append(‘添加的内容’);
在选择器中指定类和ID后，调用append并指定要添加的内容。
我们来看具体的示例
通过单击按钮在ul标签中添加li元素，代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
$(function() {
$("button").click(function() {
$("ul").append("<li>添加的内容</li>");
});
});
</script>
</head>
<body>
<button>button</button>
<ul>
</ul>
</body>
</html>在单击按钮时创建一个要触发的事件，然后在其中执行append方法。
选择器编写一个append方法，指定ul标签并为该选择器添加li标签。
因此，每次按下按钮时，都会调用append方法并增加元素数量。
在浏览器上显示效果如下
当点击button按钮时，每点击一下就会出现一个内容，点击五下的效果如下：
本篇文章到这里就全部结束了，更多精彩内容大家可以关注php中文网相关教程栏目！！！
Atas ialah kandungan terperinci 如何使用jQuery中append方法添加元素. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：如何使用Node.js创建模块（module）Artikel seterusnya：如何使用jQuery更改CSS样式