问题描述
我用这种聚合物定义了一个组件:
< polymer-element name =my-component>
< template>
< div id ='test'> CONTENT< / div>
< / template>
< / polymer-element>
现在我想访问shadow dom,例如:获取div id =' test'
var x = $(div#test)。
给定的代码不起作用。
我可以使用jquery访问shadow dom吗?
否,不在Polymer元素之外。 >
在阅读了Polymer之后,看起来您只能在Polymer元素中的脚本中访问Polymer元素的shadow-DOM。聚合物文档在上说:
这意味着您可以将< script>
标记作为兄弟添加到 ; template>
其中 this。$。test
将是您想要的元素。
< polymer-element name =my-component>
< template>
< div id ='test'> CONTENT< / div>
< / template>
< script>
Polymer('my-component',{
logNameValue:function(){
console.log('polymer element',this。$。test);
console.log ('jQuery wrapper of polymer element',$(this。$。test));
}
});
< / script>
< / polymer-element>
I defined a component with polymer like this:
<polymer-element name="my-component">
<template>
<div id='test'>CONTENT</div>
</template>
</polymer-element>
Now I want to access the shadow dom, for example: to get the content of div id='test'
var x = $("div#test").html();
The given code doesn't work.Can I access the shadow dom with jquery?
No, not outside of the Polymer element.
After reading up on Polymer, it looks like you can only have access to the shadow-DOM of Polymer elements in scripts within the Polymer element. The Polymer docs on Automatic node finding say:
This means you can add a <script>
tag as a sibling to <template>
where this.$.test
will be the element you want.
<polymer-element name="my-component">
<template>
<div id='test'>CONTENT</div>
</template>
<script>
Polymer('my-component', {
logNameValue: function () {
console.log('polymer element', this.$.test);
console.log('jQuery wrapper of polymer element', $(this.$.test));
}
});
</script>
</polymer-element>
这篇关于我可以使用jQuery访问阴影DOM吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!