与えられたhtmlでは、DOM要素がブラウザで定義された標準HTMLコンポーネント(スクリプト作成者によって定義された)dom要素がカスタムWebコンポーネントかhtml要素かを検出
Webコンポーネントが既に登録されているかどうかをプログラムでチェックする方法はありません。また、それらはともにHTMLElement
とみなされます。 DOMノードが標準のhtmlまたはカスタムWebコンポーネントであることを確認する方法はありますか?のは、私がquerySelector()
与えられたhtmlでは、DOM要素がブラウザで定義された標準HTMLコンポーネント(スクリプト作成者によって定義された)dom要素がカスタムWebコンポーネントかhtml要素かを検出
Webコンポーネントが既に登録されているかどうかをプログラムでチェックする方法はありません。また、それらはともにHTMLElement
とみなされます。 DOMノードが標準のhtmlまたはカスタムWebコンポーネントであることを確認する方法はありますか?のは、私がquerySelector()
A custom elementの名前をHTMLに定義された要素ではないだろう一方は、-
を含むようにを必要とする使用してDOM要素を取得しasumeしてみましょう。だから、:
if (theElement.tagName.includes("-")) {
// It's custom
} else {
// It isn't
}
DOM要素がregistredカスタム要素であるならば、あなたはcustomElements.get()
を使用する必要があります検出するために、(まだString#includes
を持っていない古いブラウザまたは.indexOf("-") != -1
。)。
要素がまだ登録されていない場合、または標準HTML要素の場合、このメソッドはundefined
を返します。
登録されたカスタムエレメントの場合は、class
が返されます。
customElements.define('custom-element', class extends HTMLElement {})
console.log(customElements.get('custom-element'))
console.log(customElements.get('p'))
console.log(customElements.get('fake-element'))
console.log(customElements.get('font-face'))
<custom-element></custom-element>
<fake-element></fake-element>
<p></p>
<font-face></font-face>
ヒントありがとうございます。本当に便利です! –
迅速な答えをいただき、ありがとうございます。私はフォローアップの読書をいくつか行っており、ルールを破るいくつかの[SVG要素](https://stackoverflow.com/a/22545622/1903781)があることを知りました。このシナリオを確認するのは簡単です。 –