动态添加到Internet Explorer中的Canvas元素无法正常工作

Question

我正在尝试在一些画布元素上绘制图形，并且当然，我需要在Internet Explorer中使其正常工作。因此，我进行了一些搜索并使用explorercanvas来获得该功能。但是我发现，由于某种原因，IE不喜欢在初始页面加载后添加的画布元素。

下面的示例有两个画布元素，一个存在于页面的HTML中，另一个在DOM准备就绪时添加。绘制画布的脚本仅适用于在脚本运行之前存在的元素。

Linky

我尝试使用IE调试器查找发生了什么，我看到对于HTML画布，$(this)[0]返回一个DispHTMLGenericElement，但运行时画布返回一个DispHTMLUnknownElement。我还尝试过使用document.getElementByID()，但情况也是一样的。这只是IE处理画布元素的另一个奇怪之处吗？有没有办法解决它？

- EvilAmarant7x

Answer 1

来自 Explorer Canvas 的 "instructions" 文件：

如果您动态创建了画布元素，则该元素将没有添加 getContext 方法。要使其正常工作，您需要在 G_vmlCanvasManager 对象上调用 initElement 方法。

     var el = document.createElement('canvas');
     G_vmlCanvasManager.initElement(el);
     var ctx = el.getContext('2d');

这就是了。现在，你可以使用HTML5 Canvas规范作为参考。

- Pointy

---

谢谢！此外，从阅读Explorer Canvas的“说明”页面上的评论中，我发现添加画布时需要使用document.createElement而不是$('<canvas>')。 - EvilAmarant7x