父组件
<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元素(这是自动化所必需的)