javascript - prepend 和 appendchild 之间的区别
问题描述
我在列表中插入了一个新行,这是我的代码
function newToDo() {
var newTODoList = document.getElementById('toDoListInput');
var newLine = document.createElement('li');
var list = document.getElementById('list');
newLine.textContent = newTODoList.value;
newLine.class = 'newLineClass';
list.prepend(newLine);
当我使用 appendchild 而不是 prepend 时,我的代码无法正常工作......它们之间有什么区别?
解决方案
在列表前面添加项目。追加添加项目列表的末尾。在剪断中有一个例子
$('div')
.append('<span>Append</span>')
.prepend('<span>Prepend</span>')
.before('<span>Before</span>')
.after('<span>After</span>');
div {
border:2px solid #bbb;
padding:10px;
margin:10px auto;
}
span {
display:block;
width:65px;
font:bold 12px Arial,Sans-Serif;
color:white;
padding:5px 10px;
background-color:gray;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>-------content---------</div>
推荐阅读
- angular - Angular - 使用 FormControlArray 作为数据源时向 mat-table 添加新行
- java - 单元测试存储库spring org.springframework.beans.factory.UnsatisfiedDependencyException
- ios - 带有自定义单元格的 TableView。当单元格滚动(双端队列)时,它们会以混合的 UIView 颜色重新出现。我可以在 indexPath.row 设置 UIView 吗?
- elasticsearch - 从kibana中的字符串中提取值
- list - 访问嵌套的 List 元素并转换为 List
- javascript - ReactJS - 尝试通过获取 JSON 数据来访问嵌套数组
- docker - 如何在远程 selenium 网格上从 docker 运行 testcafe
- php - 用 Woocommerce 中的 ACF 字段值替换产品重量
- selenium - 暂停 selenium 脚本一个小时,这是一个不好的自动化实践吗?如果是,为什么?
- java - 根据语言创建 jcombobox 表单枚举