Question

我正在阅读Chromium webui source code: ui.js（第+48，+ 95行），它正在使用__proto__将一个类转换为继承其他类。

然后我阅读了一些帖子以了解__proto__：

This和this表示原型链由JS VM内部维护并且始终存在，您可以使用__proto__伪属性（访问者）修改它。
Another post通过连接内部原型，您可以手动将类转换为派生自另一个类。
4th post说某些浏览器没有公开其内部原型链，因此您应该避免扩展（使用）HTMLXXXElement.prototype。
最后，{@ 3}} __proto__已被弃用。

然后很自然地，我认为应该有另一种方法来使用Object.create()创建一个DOM节点，然后将其插入到DOM中，但我尝试了跟随并失败了：

var xt = document.querySelector('#list > div:nth-child(2)');
var list = xt.parentNode;
var o = Object.create(HTMLElement.prototype);
o.innerHTML = 'This should be a Element Node';
list.insertBefore(o, xt);   // this line throws error

Chrome给我错误：

Uncaught TypeError: Failed to execute 'insertBefore' on 'Node': parameter 1 is not of type 'Node'.

我想我必须误解HTML元素Node类，而且我使用Object.create（）的方式一定是错的......但是我不知道怎么说这个问题，搜索了很多后我还是不能找出答案。

我是否必须使用document.createElement('a tag name')来创建DOM节点？

是否可以使用Object.create(HTMLElement.prototype)创建DOM节点，并避免同时使用__proto__？

万分感谢。

Answer 1

创建对象时所做的只是将其__proto__属性或原型分配给HTMLElement。这并不会自动使它成为一个Node，它仍然只是一个普通的Javascript对象，尽管它可以通过其原型链访问HTMLElement方法。

您是对的，您需要使用createElement来创建DOM节点。重要的是要记住DOM不是Javascript中固有的东西。它真的只是一种特殊的界面＆＃39;使用Javascript进行构建。

document.createElement()是浏览器提供的一种方法，专门用于构建HTML元素，因为它符合浏览器DOM实现。你理论上可以创建一个模仿Chromium实现的函数，但它是一个毫无意义的努力。

Object.create()是一个内置的Javascript函数。它是以所有形式创建Javascript对象的。 document.createElement()不是内置的Javascript函数，它由浏览器提供的DOM操作。

如何在JavaScript中使用Object.create（）创建HTML DOM节点？

1 个答案: