的Javascript直接访问DOM元素，并采用可变

Question

为什么做

var consoleElem = document.getElementById("debug"); 
consoleElem.appendChild(msgElement) 

同样的事情

document.getElementById('debug').appendChild(msgElement); 

在我看来是的DOM元素（调试）是它自己的变量，然后将其复制到另一个变量意味着我有调试元素的两个副本...为什么我应该对新副本（var consoleElem）所做的任何更改对原始DOM元素进行更改？

Answer 1

中有什么consoleElem不是DOM元素本身，而是它的一个引用..所以这通过查询进行任何改变，则实际施加到DOM元素本身..

如果你想修改一个元素而不实际改变原始元素本身，那么你应该克隆它.. jQuery提供了一个克隆功能。

Answer 2

呼叫document.getElementById返回对DOM元素的引用。所有该行

var consoleElem = document.getElementById("debug"); 

确实是将该引用存储在变量中;它不会创造任何东西。你可以有十几个引用同一个元素的变量，它仍然只是一个元素。

如果要创建元素，请使用document.createElement。如果您想复制元素，请使用newElement = oldElement.cloneNode()。