请问一下为什么在第一次打开网站时图片的高度是0刷新一次之后高度就正常了,该如何让图片的高度在第一次打开时就正常

createPicture(base64, obj = {type: "png"}) {
        let article = this.$container.children("article:last-child");
        if (article.length === 0) article = this.addPage();
        let h = 0;
        article.children().each(function () {
            h += $(this).outerHeight(); 
        });
        if (!base64.startsWith("data:image/")) base64 = `data:image/${obj.type};base64,${base64}`;
        let $new = $(`<img src="${base64}" title="${typeof obj.title === "string" ? obj.title : ""}" alt="${typeof obj.alt === "string" ? obj.alt : ""}">`);
        if (typeof obj.style === "object" && obj.style !== null) $new.css(obj.style());
        article.append($new);
        if (h + $new.outerHeight() > this.getPageHeightLimit()) {
            $new.remove();
            this.addPage().append($new);
        }

上面是我动态添加一张图片的方法

请教一下大佬们,我在第一次打开网页时,$new.outerHeight()为0,但刷新一次之后就恢复正常.这是什么原因?我应该如何让$new.outerHeight()在第一次打开时就是正常的高度?

图片高度判断只能在load事件后，即$new.bind('load',function(){//这里开始可使用宽高})

var img = new Image();
img.src = '1.png';
img.onload = function(){
var areaW = img.width;
var areaH = img.height;
//图片加载完成后，有了高度和宽度，再去搞点事，，，
}