识别没有 is= 属性的自定义内置元素
Identifying a Customized Built-In Element without an is= attribute
在我的 Chessly.github.io 项目中，我使用自定义内置 IMG 元素来定义 SVG 棋子：
问题：如何区分普通 IMG 和自定义 IMG？
document.body.append(
document.createElement("IMG", {
is: "white-queen"
});
);
这会创建一个棋子，但不会设置 is= 属性
我现在自己明确地设置了 is= 属性，但是因为这个属性什么都不做并且可以设置为任何值（我在我的自定义元素代码中使用 is 作为观察到的属性）它在走 DOM.
时，这不是区分 IMG 元素和自定义 IMG 元素的可靠方法
如果我推广一个pawn（替换img src）
<img is=white-pawn/>
和element.setAttribute("is","white-queen")
如何判断这颗棋子原来是白棋？
它仍然是自定义元素注册表中的白棋子。
我是不是忽略了什么？
JSFiddle 中的简化代码（具有基本的 SVG 形状）：https://jsfiddle.net/dannye/k0va2j76/
更新：代码（基于下面的正确答案）
let isExtendedElement = x =>
Object.getPrototypeOf(x).__proto__.constructor.name !== 'HTMLElement';
注意！ 这不会捕获 Autonomous 自定义元素！
也许更好：
let isBaseElement = x =>
Object.getPrototypeOf(Object.getPrototypeOf(x)).__proto__.constructor.name=='Element';
我认为明确添加 is 属性是目前最好的解决方案。
否则您将不得不处理 class 引用。你的情况：
yourElement.constructor === customElements.get( 'circle-image' )
yourElement.constructor === CircleImage //if it's the named class
这假设您知道要检查的自定义元素的名称。
否则你将不得不通过原型链：
CircleImage --> HTMLImageElement --> HTMLElement --> 元素 --> Node
如果 HTMLElement 只是父亲，它是一个 built-in 元素。
如果 HTMLElement 是祖父（或 grand-grand...），它可能是一个扩展的 build-in 元素。
更新
如果您使用已命名的 class，您还可以检索其名称：
elem.constructor.name
在我的 Chessly.github.io 项目中，我使用自定义内置 IMG 元素来定义 SVG 棋子：
问题：如何区分普通 IMG 和自定义 IMG？
document.body.append(
document.createElement("IMG", {
is: "white-queen"
});
);
这会创建一个棋子，但不会设置 is= 属性
我现在自己明确地设置了 is= 属性，但是因为这个属性什么都不做并且可以设置为任何值（我在我的自定义元素代码中使用 is 作为观察到的属性）它在走 DOM.
如果我推广一个pawn（替换img src）
<img is=white-pawn/>
和element.setAttribute("is","white-queen")
如何判断这颗棋子原来是白棋？
它仍然是自定义元素注册表中的白棋子。
我是不是忽略了什么？
JSFiddle 中的简化代码（具有基本的 SVG 形状）：https://jsfiddle.net/dannye/k0va2j76/
更新：代码（基于下面的正确答案）
let isExtendedElement = x =>
Object.getPrototypeOf(x).__proto__.constructor.name !== 'HTMLElement';
注意！ 这不会捕获 Autonomous 自定义元素！
也许更好：
let isBaseElement = x =>
Object.getPrototypeOf(Object.getPrototypeOf(x)).__proto__.constructor.name=='Element';
我认为明确添加 is 属性是目前最好的解决方案。
否则您将不得不处理 class 引用。你的情况：
yourElement.constructor === customElements.get( 'circle-image' )
yourElement.constructor === CircleImage //if it's the named class
这假设您知道要检查的自定义元素的名称。
否则你将不得不通过原型链：
CircleImage --> HTMLImageElement --> HTMLElement --> 元素 --> Node
如果 HTMLElement 只是父亲，它是一个 built-in 元素。
如果 HTMLElement 是祖父（或 grand-grand...），它可能是一个扩展的 build-in 元素。
更新
如果您使用已命名的 class，您还可以检索其名称：
elem.constructor.name