Verwenden von jQuery mit Schatten dom

Question

Hier habe ich Elemente mit Schatten dom erstellt.

Später im Code würde ich auf die Schatten-dom zugreifen, die ich erstellt habe. Diese Arbeit:

this.shadowRoot.getElementById("...") 
this.shadowRoot.querySelector("...") 

Dies gilt jedoch nicht:

$("...", this.shadowRoot) 

Warum das so ist? Als temporäre Lösung t seine Arbeiten zur Zeit:

$("...", this.shadowRoot.children) 

Gibt es eine bessere/elegantere Art und Weise mit dem Schatten root arbeitet mit jQuery?

Beachten Sie, dass die Version von jQuery, die ich verwende, 2.1.1 ist und ich mich nur mit Chrome befasse.

---

Edit: Anscheinend this.shadowRoot.children funktioniert nicht, wenn Knoten auf der obersten Ebene zu finden.

Answer 1

Dies könnte ein Problem mit jQuery 2.1.1 sein.

jQuery 2.1.3 in jsfiddle Mit scheint, dieses Problem zu lösen:

https://jsfiddle.net/bnh74s87/

document.addEventListener("DOMContentLoaded",function(){ 
 
    var div=document.getElementById("dTest"); 
 
    var shadow=div.createShadowRoot(); 
 
    shadow.innerHTML='<p>Hi!</p>'; 
 
    document.body.appendChild(document.createTextNode(shadow.childNodes.length)); 
 
    console.log(shadow.querySelectorAll("p")); 
 
    console.log($("p",shadow)); 
 
    $("p",shadow).html("Hello!"); 
 
},false);

<script src="https://code.jquery.com/jquery-2.1.3.js"></script> 
 
<div id="dTest"></div>