Question

我想创建一个构造函数来创建documentElement对象。

作为一个例子，考虑新的Audio（）构造函数 - 它创建一个documentElement对象，如果你传递一些变量，它会用属性填充新的documentElement。它不会将其插入DOM，只是创建对象。

所以，问题是 - 是什么让documentElement与一个vanilla javascript对象（{property：value}类型）不同，你能为对象编写构造函数，就像对象一样吗？

编辑：

我正在使用的是在没有它的浏览器中重新创建新的Audio（）构造函数，使用quicktime或flash HTMLObjectElement代替HTMLAudioElement。

对我来说，audio.constructor将引用HTMLObjectElement，因为在支持它的浏览器中使用新的Audio（），是audio.constructor引用HTMLAudioElement。

我不确定Audio.prototype。当我在具有音频支持的浏览器中查询console.log（Audio.prototype）时，它们根本不返回任何内容 - 甚至在console.log中都没有空行 - 所以这让我感到难过。但是，如果我理解正确，它不会影响我的目标。

目标是能够使用Audio构造函数进行编码，并让浏览器本地处理它，或者在需要时设置插件实例。

Answer 1

document元素不是普通的JavaScript对象，是DOM Element对象，它实现了一般 DOM Core document interface

您可以使用document.implementation.createDocument（DOM Core Level 2提供）创建documentElements：

function createDocument() {
 var doc = document.implementation.createDocument('http://www.w3.org/1999/xhtml',
                                                      'html',  null),
     body = document.createElementNS('http://www.w3.org/1999/xhtml', 'body');  

  doc.documentElement.appendChild(body);  
  return doc;
}

修改

你的意思是这样吗？

function ElementCreator(tagName, attributes){ this.element = document.createElement(tagName); for (var i in attributes) { this.element[i] = attributes[i]; } return this.element; } var anchor = new ElementCreator('a', { id: 'myLink', href:'http://google.com', innerHTML:'Link text' }); document.body.appendChild(anchor); // <a id="myLink" href="http://google.com">Link text</a>

但是我没有看到使用构造函数的太多优势。

元素从构造函数返回，对象instance丢失，上面示例中的anchor.constructor引用HTMLAnchorElement而不是ElementCreator，为此访问ElementCreator.prototype也会丢失。

如果DOM元素实例包含在成员上，或者只是实现一个简单的函数，那将更有意义。

JavaScript：构造函数可以创建documentElement对象吗？

1 个答案: