gpt4 book ai didi

javascript - 异物在 IE10 中不起作用

转载 作者:技术小花猫 更新时间:2023-10-29 12:20:35 25 4
gpt4 key购买 nike

我想使用 foreignobject 元素在 Canvas 中绘制 HTML 文本,在 MDN 中我可以看到下面的链接(参见引用资料),这在 Chrome 和 Mozilla 浏览器中工作正常但在 IE10 中不行,我使用的是 IE10。

浏览器模式:IE10 & 文档模式:标准

引用: https://developer.mozilla.org/en/docs/HTML/Canvas/Drawing_DOM_objects_into_a_canvas

错误:

DOM7000: Access Denied. Resource access is restricted for cross-origin URL: 'blob:7C72C95F-3E3F-4CD6-804C-C2D8CCC06283'. 

文件:

下面是代码片段:-

            <!DOCTYPE html>
<html>
<body>
<p><canvas id="canvas" style="border:2px solid black;" width="200" height="200"></canvas>
<script>
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var data = "<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'>" +
"<foreignObject width='100%' height='100%'>" +
"<div xmlns='http://www.w3.org/1999/xhtml' style='font-size:40px'>" +
"<em>I</em> like <span style='color:white; text-shadow:0 0 2px blue;'>cheese</span>" +
"</div>" +
"</foreignObject>" +
"</svg>";
var DOMURL = self.URL || self.webkitURL || self;
var img = new Image();
var svg = new Blob([data], {type: "image/svg+xml;charset=utf-8"});
var url = DOMURL.createObjectURL(svg);
img.onload = function() {
ctx.drawImage(img, 0, 0);
DOMURL.revokeObjectURL(url);
};
img.src = url;
</script>
</body>
</html>

最佳答案

根据 WikipediaMSDN , IE11及以下不支持<foreignObject> .

关于javascript - 异物在 IE10 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19739672/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com