聚合物成分不封装 javascript
Polymer components don't encapsulate javascript
我知道 javascript 的封装不是 Web 组件 W3C 规范的一部分,但是,使用 Polymer 避免全局名称空间污染有哪些策略?
例如,如果我在我的 Polymer 组件中包含 <script src="./jquery.js"></script>
,则 $
会泄漏到主机页面的 window 对象中。这对我来说是个大问题,因为我在 chrome 扩展中使用 Polymer。
一种方法可能是像这样制作 jquery-api.html
:
<script src="[path.to]jquery.js"></script>
<script>
(function() {
// make local $
var $ = window.$;
// kill globals
$.noConflict(true);
// make $ available via custom-element registry
Polymer({
is: 'jquery-api',
get $() {
return $;
}
});
})();
</script>
然后你就可以在任何你需要的地方使用它了:
<link rel="import" href="jquery-api.html">
<script>
(function() {
var $ = document.createElement('jquery-api').$;
Polymer({
is: 'jquery-user'
/* can use $ in here */
});
})();
</script>
我知道 javascript 的封装不是 Web 组件 W3C 规范的一部分,但是,使用 Polymer 避免全局名称空间污染有哪些策略?
例如,如果我在我的 Polymer 组件中包含 <script src="./jquery.js"></script>
,则 $
会泄漏到主机页面的 window 对象中。这对我来说是个大问题,因为我在 chrome 扩展中使用 Polymer。
一种方法可能是像这样制作 jquery-api.html
:
<script src="[path.to]jquery.js"></script>
<script>
(function() {
// make local $
var $ = window.$;
// kill globals
$.noConflict(true);
// make $ available via custom-element registry
Polymer({
is: 'jquery-api',
get $() {
return $;
}
});
})();
</script>
然后你就可以在任何你需要的地方使用它了:
<link rel="import" href="jquery-api.html">
<script>
(function() {
var $ = document.createElement('jquery-api').$;
Polymer({
is: 'jquery-user'
/* can use $ in here */
});
})();
</script>