有一个div里面填充好多数据，这些数据又是根据不同接口而来，如何知道这个div的最终高度？

Question

场景：一个页面有一个div，里面有几块数据，这些数据都是几个接口返回后填充上去，然后把div高度撑起来，现在需要知道这个div最终的高度，然后用这个高度去做别的事情，要怎么样才能确定他的高度不再变化了呢？

现在是setTimeout等1S之后再去拿高度，但是感觉不靠谱，有没有更好的方法？

Answer 1

这种场景一般是记录所有接口都返回结果了才去获取div的高度，可以使用：
1、使用Promise.all方法，等所有结果都返回了，在回调中处理

Promise.all([req1, req2]).then(([res1, res2]) => {
    // 这里获取div高度
})

2、定义一个变量来记录已经返回结果的接口数量，定义个方法来判断，每个接口返回里面都执行一下这个方法

let reqCount = 0;
function checkAllReq() {
    // 这里假设总共有5个接口请求
    if(++reqCount === 5) {
        // 这里获取div高度
    }
}

Answer 2

Mutation Observer API 可以监听DOM变化： MutationObserver