Question

正如规范所述：

The contents of the canvas element, if any, are the element's fallback content.

所以，我认为做这样的事情是合理的：

<head>           
    <script type="text/javascript">
$(document).ready(function()
{
    var canvas = document.querySelector("canvas");
    if (canvas != null)
    {
        var context = canvas.getContext("2d"),
            image   = canvas.querySelector("img");

        // do something special with 'context' and 'image'
    }
});
    </script>
</head>
<body>
    <canvas>
        <img class="myImageType" style="border: 1px solid #777;" src="file">
    </canvas>
</body>

如您所见，我不重新创建图像，而是使用嵌套图像。创建一个新的，对我来说没有意义。但是，该样式不适用于嵌套的图像元素。

Answer 1

找到解决方案：我需要为canvas和嵌套img设置样式，或者为它们添加相同的class：

<body>
    <canvas class="myImageType">
        <img class="myImageType">
    </canvas>
</body>

如何设置canvas元素的后备内容的样式？

1 个答案: