Question

为什么这不起作用：

 document.createElement('ul').appendChild(document.createElement('li'))

如果我将已创建的元素保存在变量中并尝试将其中一个附加到其他（父项）中，也会发生这种情况。

UPD：我需要返回（节点）或html，如<ul><li><li><ul>

Answer 1

您只需要将UL附加到某个内容......

const appendList = (trunk, n) => {
  const ul = document.createElement('ul')
  for (let i = 0; i < n; i++) ul.appendChild(document.createElement('li'))
  trunk.appendChild(ul)
}

appendList(document.body, 4)

const element = document.getElementById('element')
appendList(element, 2)

或者，您可以执行以下操作

const appendList = (trunk, n) => {
  const ul = document.createElement('ul')
  for (let i = 0; i < n; i++) ul.appendChild(document.createElement('li'))
  document.querySelector(trunk).appendChild(ul)
}

appendList('#element', 10)
appendList('.otherElement', 3)

Answer 2

主要问题是document.createElement('ul')尚未添加到文档中。因此，向其附加另一个元素不会影响文档。

在下面的代码段中，我已将ul附加到body，然后将li附加到ul。希望它有所帮助。

＆＃13;

 document.getElementsByTagName("body")[0].appendChild(document.createElement('ul')).appendChild(document.createElement('li'))

＆＃13;

为什么appendChild替换parentElement？

2 个答案: