javascript - 如何在 JavaScript 中完成一个进程后执行另一个进程

Question

我想通过Javascript添加图像，然后计算html元素宽度为

window.onload=function(){
document.getElementById('x').addEventListener('click', function(e){
    var el = document.getElementById('xx');
    el.innerHTML = '<img src="img.jpg" />';
    var width = el.offsetWidth;
    .....
   }, false);
}

但是由于 JavaScript 同时执行所有进程，我将在加载图像之前获取元素的宽度。如何确保图像已加载到内容中；然后计算元素宽度？

更新:感谢您的回答，但我认为存在误解。 DOM 文档中不存在 img src="img.jpg"/>。稍后将通过 Javascript 添加。然后，当尝试通过 Id 捕获元素时，它可能不存在。

Answer 1

您可以给 img 一个 ID 并执行以下操作:-

var heavyImage = document.getElementById("my-img");//assuming your img ID is my-img
heavyImage.onload = function(){
    //your code after image is fully loaded
}