javascript Window.getComputedStyle 未在 Firefox 中实现接口元素错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22849138/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Window.getComputedStyle does not implement interface Element error in Firefox
提问by Steve Macculan
I'd like to append some data to the HTML element, so I've used the following code:
我想向 HTML 元素附加一些数据，因此我使用了以下代码：
$("#bookListDiv").append(data.HTMLString);
and everything has working, but then I'd like to add a fadein animation while displaying this element, so I've modified it to:
一切正常，但是我想在显示此元素时添加淡入淡出动画，因此我将其修改为：
$(data.HTMLString).hide().appendTo("#bookListDiv").fadeIn(1000);
Animation is working on Chrome but on Firefox I see the following error in console: TypeError: Argument 1 of Window.getComputedStyle does not implement interface Element. I'm using jquery 1.8.2.
动画在 Chrome 上运行，但在 Firefox 上我在控制台中看到以下错误：TypeError：Window.getComputedStyle 的参数 1 没有实现接口元素。我正在使用 jquery 1.8.2。
Could you advise me what can be wrong? I supposed something with data, but in the first approach everything is working correctly.
你能告诉我有什么问题吗？我假设有一些数据，但在第一种方法中一切正常。
采纳答案by Steve Macculan
I've found the solution by adding the delay before fadeIn function. Code after changes:
我通过在fadeIn 函数之前添加延迟找到了解决方案。修改后的代码：
$(data.HTMLString).hide().appendTo("#bookListDiv").delay(100).fadeIn(1000);
As I've noticed the number in delay is should be adjusted to the size of data, in my case for 7KB json data it is working, but I've started from 1000.
正如我注意到延迟的数量应该根据数据的大小进行调整，在我的情况下，对于 7KB json 数据它正在工作，但我从 1000 开始。
回答by Chad Hedgcock
You will also get this if you call getComputedStyleon <html>. It should be common sense, but I had a recursive function that was bubbling up from inner elements with this function and giving the error when it ended up at the document root.
如果您致电getComputedStyle，您也会收到此信息<html>。这应该是常识，但我有一个递归函数，该函数从内部元素冒泡到这个函数，并在它最终到达文档根时给出错误。
回答by Gavin Wahl
This problem was wontfixed in jQuery: http://bugs.jquery.com/ticket/12462.
这个问题在 jQuery 中没有得到修复：http://bugs.jquery.com/ticket/12462 。
The workaround is to wrap your HTML in a single element before giving it to jQuery.
解决方法是在将 HTML 提供给 jQuery 之前将其包装在单个元素中。
回答by brandonjp
Try making sure you're using correct markup syntax as well.
尝试确保您也使用正确的标记语法。
I'm using AngularJS to dynamically change the disabled button state while at the same time hiding/showing a button... this made Firefox freakout with the "Window.getComputedStyle does not implement interface Element" error (but Safari/Chrome/IE).
我正在使用 AngularJS 动态更改禁用的按钮状态，同时隐藏/显示按钮......这让 Firefox 因“Window.getComputedStyle 未实现接口元素”错误（但 Safari/Chrome/IE）而惊慌失措.
In my case the real issue was that the markup I was working with did not have matching opening/closing tags: <button ng-disabled="!x">Click</div>
就我而言，真正的问题是我使用的标记没有匹配的开始/结束标签： <button ng-disabled="!x">Click</div>
Once corrected: <button ng-disabled="!x">Click</button>things were fine.
一旦更正：<button ng-disabled="!x">Click</button>一切都很好。
Strangely, both previous answers were partial solutions though: wrapping a $timeout around my hiding/showing as the first-posted answer suggested worked (but the delay had to be a substantial amount) and wrapping the element in an additional element worked as well but was not the implementation I needed (and created other issues).
奇怪的是，虽然之前的两个答案都是部分解决方案：在我的隐藏/显示周围包裹 $timeout 作为第一个发布的答案建议有效（但延迟必须很大）并将元素包裹在附加元素中也有效，但是不是我需要的实现（并产生了其他问题）。
I've tried but simply cannot get a code sample working to reproduce this issue.
我已经尝试过，但根本无法获得代码示例来重现此问题。
