首页 > 解决方案 > 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 时,我的代码无法正常工作......它们之间有什么区别?

标签: javascript

解决方案


在列表前面添加项目。追加添加项目列表的末尾。在剪断中有一个例子

$('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>


推荐阅读