Question

这是HTML代码此代码在Mozilla中有效，但在Chrome中无效。

<!DOCTYPE html>
<html>
  <body>
    <ul id="myList1">
      <li>Item 1</li>
      <li>Item 2</li>
    </ul>
    <ul id="myList2">
      <li>Water</li>
      <li>
        <input id="files" name="files" type="file" />
      </li>
    </ul>
    <p>Click the button to copy an item from one list to another.</p>
    <button onclick="myFunction()">Try it</button>
    <p>Try changing the <em>deep</em> parameter to false, and only an  empty LI element will be cloned.</p>
    <script>
      function myFunction() 
      {
        var itm = document.getElementById("myList2").lastChild;
        var cln = itm.cloneNode(true);
        document.getElementById("myList1").appendChild(cln);
      }
    </script>
  </body>
</html>

Answer 1

你能否更准确地解决你的问题

Answer 2

lastChild包括所有节点子节点，包括文本节点。所以你得到的不是一个元素，而是一个文本节点，在</li>和</ul>之间有换行符和空格。

所以你想要的是最后一个子元素，而不是最后一个子节点。

你可以用

做什么

function myFunction() 
{
  var itm = document.getElementById("myList2").lastElementChild;
  var cln = itm.cloneNode(true);
  document.getElementById("myList1").appendChild(cln);
}

克隆不在Chrome中复制输入值，但在Mozilla中工作

2 个答案: