javascript - 我可以将 HTML 元素合并到对象吗？

Question

我希望能够获取 HTML 元素的所有属性并将它们附加到一个对象，以便该对象像 HTML 元素一样工作。

var clone = {};

function maker(obj){
  var e = document.createElement("div");
  e.innerHTML = "hello world";

  for(var key in e){
    obj[key] = e[key];
  }
}

maker(clone);
clone = <div>hello world</div>

这在一定程度上有效。 clone将接收元素的一些属性，但我需要能够进行深度迭代，并且我需要处理循环引用才能获取所有内容。我还想知道我正在尝试做的事情是否还有其他问题？

另外，是的，我意识到我可以轻松做到:

function maker(){
  var e = document.createElement("div");
  e.innerHTML = "hello world";
  return e;
}

var clone = maker();
clone = <div>hello world</div

另一个几乎按我想要的方式工作的选项:

var clone = {};

function maker(obj){
  var e = document.createElement("div");
  e.innerHTML = "hello world";
  obj.e = e.cloneNode(true);
}

maker(clone);
clone.e = <div>hello world</div>

但最佳解决方案是能够写 maker(clone)并有clone = <div>hello world</div>

Answer 1

使用element.cloneNode(true)深度克隆 HTML 元素。

function maker(){
  var e = document.createElement("div");
  e.innerHTML = "hello world";
  return e.cloneNode(true);
}