保留Shadow Dom主机内容

时间:2013-09-26 19:46:12

标签: javascript dom shadow-dom

我正在DOM元素/主机上创建一个ShadowDom。我可以使用select属性保留(仍然可见)相应的主机childElements,但是未选择主机内部的文本childNode,并且仍然不可见。

除了在childElements上使用select属性外,你能保留ShadowDom主机的内容吗?

这是我的代码:

<div id="element">
      <div class="first">This will be displayed</div>
      This text node will be not displayed...and I want to
</div>

<template id="template">

      <div style="color: red;">
        <content select=".first"></content>
      </div>

</template>

http://jsfiddle.net/JgfKz/2/

1 个答案:

答案 0 :(得分:0)

我明白了。如果有人需要这个:

var element = document.querySelector('#element');
var root1 = element.webkitCreateShadowRoot();
root1.innerHTML = '<div>Root extra ShadowDom content</div><content></content>';

然后我想到的更为简单: http://jsfiddle.net/JgfKz/4/