問題タブ [native-web-component]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Custom Element getRootNode.closest() function crossing multiple (parent) shadowDOM boundaries
I spent some time searching but have only seen too many regular "walk the DOM" blogs or answers that only go one level UP with getRootnode()
Pseudo code:
HTML
The standard element.closest() function does not pierce shadow boundaries;
So this.closest('element-x') returns null because there is no <element-x> within <element-z> shadowDom
Goal:
<element-x>子孫の内部から検索<element z>(ネストされた任意のレベル)
必須：
.closest()(シャドウ) DOMをたどって検索する (再帰的)関数<element-x>
注: 要素には ShadowDOM がある場合とない場合があります (参照<element y>: lightDOM のみ)
明日は自分でできますし、そうするつもりです。明るい心がすでにそれを行っているのではないかと思っただけです。
資力：
- https://developer.mozilla.org/en-US/docs/Web/API/Node/getRootNode
- https://developer.mozilla.org/en-US/docs/Web/API/ShadowRoot/host
アップデート
これは、以下の回答からの UNminified コードです。
アップデート #2
BaseElement のメソッドに変更しました。