0
キャンバス要素を作成するために、Webコンポーネント、テンプレート、およびシャドーDOMを利用しようとしています。問題は私がプロトタイプの中でcontexを得ることができないか、またはシャドウを作成するときにこのエラーが出ることです。HierarchyRequestError: 'Element'で 'createShadowRoot'を実行できませんでした。キャンバスシャドーDOMとWebコンポーネント
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="import" href="mycanvas.html">
</head>
<body>
<canvas is="my-canvas"></canvas>
</body>
</html>
<template id="mytemplate">
<style>
p {color:green;}
span {text-decoration: underline;}
canvas {background-color: #f00;
width:300px;}
</style>
</template>
<script>
(function() {
var myPrototype= Object.create(HTMLElement.prototype);
var myDocument=document.currentScript.ownerDocument;
myPrototype.createdCallback=function() {
var shadow= this.createShadowRoot();
var template=myDocument.querySelector("#mytemplate");
var clone= document.importNode(template.content, true);
shadow.appendChild(clone);
} //end prototype
var myCanvas= document.registerElement('my-canvas', {
prototype: myPrototype,
extends:'canvas'
});
}());
</script>
'' VARシャドウ= this.createShadowRoot()でthis'何ですかを定義するとき
HTMLElement.prototype
ためHTMLCanvasElement.prototype
に置き換えてみてください。 '? '