聚合物访问来自父Shadow DOM的子Shadow DOM元素和来自子Shadow DOM的父Shadow DOM元素

时间:2016-08-22 14:07:51

标签: javascript dom polymer

父组件

 <link rel="import" href="../elements/multi-child.html">
    <dom-module  id="multi-dom">
        <template>
            <h1 id="element-in-parent-dom">Element in parent DOM</h1>
            <multi-child></multi-child>
        </template>
        <script>
            Polymer({
              is: "multi-dom",
            ready:function(){
              var elementinchilddom = document.getElementById('element-in-child-dom');
              if(elementinchilddom){
                console.log('Parent Dom able to find Element in child dom');
              }
              else{
                console.log('Parent Dom unable to find Element in child dom');
              }
            }
            });
        </script>
     </<dom-module>

子组件

<link rel="import" href="../bower_components/polymer/polymer.html">
<dom-module  id="multi-child">
    <template>
        <h1 id="element-in-child-dom">Element in child DOM</h1>
    </template>
    <script>
        Polymer({
          is: "multi-child",
        ready:function(){
          var elementinparentdom = document.getElementById('element-in-parent-dom');
          if(elementinparentdom){
            console.log('Child Dom able to find element-in-parent-dom');
          }
          else{
            console.log('Child dom unable to find element-in-parent-dom');
          }
        }
        });
    </script>
</dom-module >

我创建了一个演示父组件和子组件。当我包含标记<multi-dom></multi-dom>时。我得到以下结果

  

Hello World无法找到element-in-parent-dom

     

Hello World无法在子dom中找到Element

是否有其他方法可以访问子DOM和父DOM元素? 也可以使用文档对象访问阴影DOM元素(这是自动化所必需的)

0 个答案:

没有答案