时间戳

首页 > 解决方案 > 执行简单的脚本，但控制台警告 ~= 'getComputedStyle' on 'Window': parameter is not of type 'Element'

javascript - 执行简单的脚本，但控制台警告 ~= 'getComputedStyle' on 'Window': parameter is not of type 'Element'

问题描述

当在 chrome 的控制台中运行时，这会删除网页顶部的固定菜单栏（就像 SO 一样）。还有其他几个类似的问题，但他们问“为什么不执行”（语法错误？） - 这是一个简单且易于测试的示例，它执行但警告：

未捕获的类型错误：无法在“窗口”上执行“getComputedStyle”：参数 1 不是“元素”类型。

    var target = document.getElementsByTagName("*");
    for(ii in target){
        if(window.getComputedStyle(target[ii]).position === 'fixed'){
           target[ii].style.display = 'none';
           console.log('it"s gone');
        }
    }

getElementsByTagName 返回一个活动节点列表，它们如何不被视为元素？

标签： javascriptgoogle-chrome-devtools

解决方案

问题在于，它不仅for .. in会为您提供像对象这样的数组的索引（它不是数组，它是HTMLCollection我认为或NodeList

解决方案 1：检查 target.hasownPropert(ii) 是否为真

var target = document.getElementsByTagName("*");
for(var ii in target){
    if(target.hasOwnProperty(ii)) {
        if(window.getComputedStyle(target[ii]).position === 'fixed'){
           target[ii].style.display = 'none';
           console.log('it"s gone');
        }
    }
}

解决方案2：用于...的

var target = document.getElementsByTagName("*");
for(var ii of target){
    if(window.getComputedStyle(ii).position === 'fixed'){
       ii.style.display = 'none';
       console.log('it"s gone');
    }
}

解决方案 3：使用 document.querySelectorAll

document.querySelectorAll('*').forEach(ii => {
    if(window.getComputedStyle(ii).position === 'fixed'){
       ii.style.display = 'none';
       console.log('it"s gone');
    }
});

推荐阅读