求助：Window.getComputedStyle参数1未实现Element接口错误排查

嘿，这个坑我之前也踩过！马上帮你理清楚问题所在。

错误原因 #

你这里的核心问题很明确：$('.reveal')返回的是jQuery包装后的对象，而非原生的DOM Element节点。但window.getComputedStyle()的第一个参数要求必须是实现了Element接口的原生DOM元素，直接传jQuery对象自然就触发这个报错了。

另外还要提一句：getComputedStyle的第二个参数是用来指定伪元素（比如:before/:after）的，不是样式属性名，你之前传'margin'也是个小误区哦。

解决方法 #

有两种简单的修复方式，看你习惯哪种：

方法1：从jQuery对象中提取原生DOM元素 #

jQuery对象本质是类数组结构，你可以通过下标或者.get()方法取出里面的原生DOM元素，再传给getComputedStyle：

var reveal = $('.reveal'); 
reveal.css('margin', '10px'); 
// 方式1：通过下标[0]获取第一个匹配的DOM元素
var result = window.getComputedStyle(reveal[0], null);
// 方式2：用.get(0)方法获取原生元素
// var result = window.getComputedStyle(reveal.get(0), null);
// 再获取margin的计算值
console.log(result.margin);

方法2：直接用jQuery的.css()方法获取计算样式 #

其实jQuery已经封装了获取计算样式的逻辑，完全不用手动调用原生API，直接用.css()方法就能拿到最终的计算后样式值：

var reveal = $('.reveal'); 
reveal.css('margin', '10px'); 
// 直接用jQuery的css方法获取计算后的margin
var result = reveal.css('margin');
console.log(result);

这种方式更贴合jQuery的使用习惯，代码也更简洁。

内容的提问来源于stack exchange，提问作者Anatole Lucet