Import custom HTML element with shadow DOM
|
1 2 3 4 |
<!-- importing document --> <link rel="import" href="my-element.html"> |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<!-- my-element.html --> <template> <!-- HTML, JavaScript, CSS here will not be accessible from importing document --> </template> <script> (function() { var component = document.currentScript.ownerDocument; var tpl = component.querySelector('template'); var MyProto = Object.create(HTMLElement.prototype); MyProto.createdCallback = function() { this.root = this.createShadowRoot(); this.root.appendChild(document.importNode(tpl.content, true)); }; document.registerElement('my-element', { prototype: MyProto }); })(); </script> |
Recent Comments
Aciu uz straipsni!
— Rivanda, 5 skyrius
Galėtų būti daugiau komentarų.
— Alter ego, WordPress download and extract script
Jėga!
— Darius, WordPress download and extract script
