问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

无法获取js创建的元素高度？

头像
新一代英雄
    401910

    元素的高度都是自动的，元素都在页面上渲染了，就是无法获取它的高度。
    console.log()返回的永远是空字符串！
    为什么？？
    对了，我要用js创建很多<div><img src=""></div>这样的结构。
    现在的问题就是，我无法获取div的真实高度，因为图片还没有加载完。

    javascripthtmlhtml5css
    阅读 5.4k
    4 个回答
    得票最新
    头像
    billwong
      9202711

      获取动态元素，需要在这个元素创建显示出来之后，再获取他的高度

      头像
      guangpunba
        5.4k42754

        你设置高度了吗

        头像
        dctxf
          15717
          $(document).ready(function () {
    console.log(obj.offsetWidth);    //这样可以得到用js创建或者直接写出来的元素宽度
    console.log(obj.style.width);    //这样只能得到js设置的元素宽度
});

          下面是我写的demo，你可以试试

          <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        #demo{
            width:100px;
            height:100px;
            background-color:blue;
        }
    </style>
</head>
<body>
    <div id="demo">aaa</div>
</body>
<script>
    window.onload = function(){
        var div = document.createElement('div');
        div.innerHTML = 'aaaa';
        // div.style.width = '100px';
        div.style.background = 'red';
        document.body.appendChild(div);
        console.log(div.offsetWidth);
        console.log(div.style.width);

        var demo = document.getElementById('demo');
        console.log(demo.offsetWidth);
        console.log(demo.style.width);
    };
</script>
</html>
          头像
          zhangsihong
            10457

            window.onload=function(){//获取高度}。用这个试试，等页面全部加载完毕之后再获取，可能页面还没加载完毕就执行console.log了

            撰写回答
            你尚未登录，登录后可以
            • 和开发者交流问题的细节
            • 关注并接收问题和回答的更新提醒
            • 参与内容的编辑和改进，让解决方法与时俱进
            推荐问题