-1

我尝试使用 javascript 访问 div 的宽度，但无论我设置什么，它每次都打印 NaN。我是 javascript 新手，我的代码有什么问题？

    <html>
    <head>
        <title>hello</title>


        <style type="text/css">

      #base
      {
        width:300px;
        height:30px;
        background-color: black;
      }

      #scr
      {
        height:30px;
        width:10px;
        background-color: red;
      }

    </style>


    <script type="text/javascript">

    var magic = function()
    {
    console.log("inside magic")
    var d = document.getElementById("scr");
    var b =  d.style.width;
    console.log(b);
    b = parseInt(b);

    console.log(b);

    }


    </script>

    </head>

    <body>

    <div id="base">
    <div id = "scr" >
    </div>
    </div>

    <br>
    <button onclick="magic()">Magic</button>


    </body>
</html>
4

3 回答 3

1

您可以使用此功能来做到这一点：

function getStyle(el,styleProp)
{
    var x = document.getElementById(el);
    if (x.currentStyle)
        var y = x.currentStyle[styleProp];
    else if (window.getComputedStyle)
        var y = document.defaultView.getComputedStyle(x,null).getPropertyValue(styleProp);
    return y;
}

发生的事情的解释在这里 注意，您必须使用元素的 id 通过函数访问其样式属性。如果要使用选择器，请使用 document.querySelector() 代替 document.getElementById()

于 2013-02-16T21:00:42.953 回答
0

你应该试试

d.offsetWidth

代替

d.style.width
于 2013-02-16T21:04:03.830 回答
-1

该代码d.style.width返回由 css 明确指定的宽度，同时d.offsetWidth返回计算的宽度。

于 2013-02-16T21:08:47.593 回答