创建影子DOM,createShadowRoot()。影子dom能将内部的节点信息封装起来,例如video与auto标签,影子dom的子树在dom结构中是不可见的,chrome可以通过setting打开。
代码:
<!DOCTYPE HTML>
<html>
<body>
<div id='div'></div>
<script>
window.onload=function(){
var adiv=document.getElementById('div');
root=adiv.createShadowRoot();
var shadowImg=document.createElement('img');
shadowImg.src='/i/eg_mouse.jpg';
var shadowDiv=document.createElement("div");
shadowDiv.innerHTML='this is a shadow div';
root.appendChild(shadowImg);
root.appendChild(shadowDiv);
}
</script>
</body>
</html>
查看dom: