cloneNode() 在 Internet Explorer 10 和 11 中更改属性值答案

【问题标题】：cloneNode() changes attribute value in InternetExplorer 10 and 11cloneNode() 在 Internet Explorer 10 和 11 中更改属性值
【发布时间】：2015-08-31 02:03:37
【问题描述】：

当我在名称为 feGaussianBlur 且具有属性 stdDeviation 的元素上调用 cloneNode() 时，InternetExplorer（10 和 11）总是将值转换为 1.72443e+009。

这是一个说明问题的四行代码：https://jsfiddle.net/kytbh4Ls/6/

如果您更改元素名称、使用不同的属性名称或在任何其他浏览器（Chrome、Firefox）上运行 fiddle，一切都会按预期运行。使用不同的属性值不会改变任何东西。

这种非常奇怪的行为可能是什么原因？有什么可以做的吗？

这是一个使用 jQuery 的 clone() 而不是 cloneNode() 的修改小提琴，不幸的是产生了相同的结果：https://jsfiddle.net/kytbh4Ls/7/

【问题讨论】：

听起来像一个错误。向微软报告。 blog.reybango.com/2013/02/28/…
你的意思是，不管它以前有多少价值？

标签： javascript jquery internet-explorer svg clone

【解决方案1】：

这是 Internet Explorer 中的一个明显错误。虽然 Internet Explorer 确实使用 stdDeviation 而不是 stdDeviationX 和 stdDeviationY，但 cloneNode() 函数在处理属性方面没有任何意义。它应该返回节点的克隆，而不是具有更改属性的节点。

您应该将此情况报告给 Internet Explorer 开发团队（如果您有时间的话）。目前您所能做的就是实施手动解决方法。

【讨论】：

【解决方案2】：

问题是IE没有使用stdDeviation属性。相反，它使用 stdDeviationX 和 stdDeviationY。

看到这个小提琴...FIDDLE

这里是Microsoft page for feGaussianBlur

var element = document.createElementNS('http://www.w3.org/2000/svg', "feGaussianBlur");
element.setAttribute('stdDeviationX', 5);
element.setAttribute('stdDeviationY', 5);

var clonedElement = element.cloneNode();

alert("Original:" + element.getAttribute("stdDeviationX") + ", Cloned:" + clonedElement.getAttribute("stdDeviationX"));

【讨论】：

谢谢，但 stdDeviationX 和 stdDeviationY 在 InternetExplorer 上的 SVG 中不起作用。正确的属性是 stdDeviation。这是一个比较属性的非常简单的 SVG：jsfiddle.net/1vkn22bp 如您所见，只有 stdDeviation 给出了预期的效果。此外，即使不支持 stdDeviation，浏览器也没有理由在克隆时更改属性值。
臭名昭著是对的。 IE 使用 stdDeviationX 和 stdDeviationY。是什么阻止您在克隆元素上设置 stdDeviation，例如 clonedElement.setAttribute("stdDeviation", 5);
我不知道你正在测试哪个版本的 IE，但在 IE11 中 stdDeviationX 和 stdDeviationY 不起作用，而 stdDeviation 会产生效果，但在克隆时会中断。