Question

我正在使用一个简单的javascript函数，但无法正常工作。它包含一个if语句，用于检查style.width === "50px"是否有效，但始终返回false

这是我的代码：

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
<div class="wrapper">
    <div class="header">
        <button id="menuknop" onclick="menu()"></button>    
        <ul>
            <li>Home</li>
            <li>Projecten</li>
            <li>Over ons</li>
            <li>Contactt</li>
         </ul>

    </div>

    <div class=content>
        <ul class="ulmenu">
            <li>Home</li>
            <li>Projecten</li>
            <li>Over ons</li>
            <li>Contact</li>
        </ul>
    </div>
</div>

<script>
function menu(){
    var header = document.querySelector(".header");
    if(header.style.height === "50px") {
        console.log("doet het")
    }
}
</script>
</body>
</html>

Answer 1

尝试使用：

window.getComputedStyle(header).getPropertyValue('height')

请参阅：https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle

您也可以使用header.offsetHeight或header.clientHeight

javascript CSS style.width不断返回错误

1 个答案: