Question

我想在页面中异步插入一些html，然后执行一些与插入的DOM相关的javascript代码。

这种努力总是失败，因为浏览器中的DOM渲染比下一个执行的javascript代码需要更多的时间。

我之前遇到过这样的问题并且问了一个问题，但是没有人回答。就在这里：https://stackoverflow.com/questions/31935005/whats-going-on-with-dom-after-orientationchange-event

那么，我可以得到一个承诺或附加一些回调函数吗？

代码：

var bubble = function bubble(type,content){
    var myScroll, temp = document.createElement('div');
    temp.innerHTML=content;
    temp.className=type==='time'?'time':'bubble '+type;
    document.getElementsByClassName('dialogue')[0].appendChild(temp);
    if(type==='reply')myScroll = new IScroll('.dlg-wrapper', { mouseWheel: true });
};

Answer 1

据我所知，没有人可以倾听的事件。但是你可以做一些通常用于动画的东西。为了让动画以高速率顺利运行，必须批量处理所有DOM Access，因为FastDom.js试图抽象出来。

总而言之，选择的武器应该是requestAnimationFrame()，以便将您的DOM访问权限转移到框架，浏览器已经更新了DOM。

在您的情况下，new IScroll(...)需要进行处理，直到querySelector('.dlg-wrapper')实际返回所需的元素。

Answer 2

我不认为渲染是异步的，但它是由仅在脚本结束后处理的消息触发的。

但你说＆＃34;然后执行一些与插入的DOM相关的javascript代码。＆＃34; 。我不会在您的代码中看到这种情况。

无论如何，如果你使用setTimeout(callback, 0)，你可以在回调中进行后处理。 setTimeout也由该消息队列控制，因此在完成修改DOM的代码之后，浏览器将首先处理重绘消息（因为它首先在消息队列中），然后才调用回调。

是否有一些关于浏览器渲染成功的承诺？

2 个答案: