html - How to get element in shadow root with JavaScript? -

i need elements shadow dom , change it. how can it?

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

here example:

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 element inside shadow ! //"container.shadowroot" represents youngest shadow root hosted on element ! console.log(container.shadowroot.queryselector(".test").innerhtml); 

demo:

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 element inside shadow !  console.log(container.shadowroot.queryselector(".test").innerhtml);

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

i hope you.