search

Home  >  Q&A  >  body text

javascript - ie7 获取clientHeight&clientWidth总是0

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    .content{}
    .item{height:20px;border:1px solid #ddd;}
    </style>
</head>
<body>

<p id="content" class="content">
    <p id="item" class="item">aaa</p>
</p>

<script type="text/javascript">
    var item = document.getElementById('item'), ch = item.clientHeight, pch = item.parentNode.clientHeight;
    console.log({ch: ch, pch: pch});
</script>
</body>
</html>

IE7下能获取.item的clientHeight但获取不到.content的clientHeight

chrome下是正常的

ringa_leeringa_lee2902 days ago445

reply all(2)I'll reply

  • 阿神

    阿神2017-04-10 14:54:13

    IE7 的坑。

    一个元素如果没有任何 style,IE7 不会计算任何高度和宽度。所以呢,随便给它个 style 就好了。

    reply
    0
  • 阿神

    阿神2017-04-10 14:54:13

    获取元素高和宽是
    element.offsetWidth和element.offsetHeight。至于
    clientWidth clientHeight 是获取客户端的

    reply
    0
  • Cancelreply