如何使用JavaScript获取用户代理阴影根中的元素？

我需要从Shadow DOM获取元素并进行更改.我怎么能这样做？

<div>
     <input type="range" min="100 $" max="3000 $">
</div>

解决方法:

这是一个例子：

var container = document.querySelector('#example');
//Create shadow root !
var root = container.createShadowRoot();
root.innerHTML = '<div>Root<div class="test">Element in shadow</div></div>';

//Access the element inside the shadow !
//"container.shadowRoot" represents the youngest shadow root that is hosted on the element !
console.log(container.shadowRoot.querySelector(".test").innerHTML);

演示：

var container = document.querySelector('#example');
//Create shadow root !
var root = container.createShadowRoot();
root.innerHTML = '<div>Root<div class="test">Element in shadow</div></div>';

//Access the element inside the shadow !
console.log(container.shadowRoot.querySelector(".test").innerHTML);

<div id="example">Element</div>

我希望这能帮到您.

标签：html,javascript,web-component,shadow-dom
来源： https://codeday.me/bug/20190917/1808845.html