javascript - 如何获取已注册的自定义元素列表

Question

我正在尝试检测是否注册了具有特定名称的自定义元素。有没有办法进行这样的检查？

或者有没有办法获取已注册自定义元素的列表？

我做了 document.registerElement，但还有什么？是单向 API 吗？

Answer 1

有一种方法可以检查元素是否已注册。已注册的元素有自己的构造函数，而未注册的元素将使用普通的 HTMLElement() 作为构造函数(或 HTMLUnknownElement() 是否名称无效，但这超出了范围的问题):

document.registerElement('x-my-element');
document.createElement('x-my-element').constructor
//⇒ function x-my-element() { [native code] }
document.createElement('x-my-element-not-registered').constructor
//⇒ function HTMLElement() { [native code] }

也就是说，检查器可能看起来像:

var isRegistered = function(name) {
  return document.createElement(name).constructor !== HTMLElement;
}

或者，使用语法糖:

String.prototype.isRegistered = function() { 
  return document.createElement(this).constructor !== HTMLElement; 
}
'x-my-element'.isRegistered()
//⇒ true
'xx-my-element'.isRegistered()
//⇒ false

最谨慎的版本:

String.prototype.wasRegistered = function() { 
  switch(document.createElement(this).constructor) {
    case HTMLElement: return false; 
    case HTMLUnknownElement: return undefined; 
  }
  return true;
}
'x-my-element'.wasRegistered()
//⇒ true
'xx-my-element'.wasRegistered()
//⇒ false
'xx'.wasRegistered()
//⇒ undefined

据我所知，无法访问已注册元素的列表。

顺便说一句，我仍然认为try-catched 注册(由@stephan-muller 提议)更适合您的需求。