javascript - 只有在 DOM 操作完成后才继续执行

Question

document.getElementById('my_id').innerHTML = 'A message';
// Next should only be executed once DOM manipulation has completed
.. do some stuff

我看过这个jQuery/Javascript - How to wait for manipulated DOM to update before proceeding with function ，这建议使用 setTimeOut。

document.getElementById('my_id').innerHTML = 'A message';
setTimeout(function(){
     .. do some stuff 
},10);

然而，这是一场我不喜欢的比赛。我需要确定，也不想浪费时间等待。其中一条评论指出，即使是 0ms 也能工作，因为它将它放入队列中，并且保证仅在 DOM 操作完成后执行。这是绝对确定的吗？如果是这样，这个状态或测试在哪里？

(当然，操作可以比这个例子更复杂，插入的HTML甚至可能包含自己执行的javascript。插入的JS执行不一定要完成，但渲染必须已经完成。)

Answer 1

您应该在其他操作上从事件监听器触发其他事件。基本上你可以有这样的东西

$(".button").click(function(){
// perform your actuibs and do some interesting stuffs
$(".anotherButton").click()
})

$(".anotherButton").click(function(){
// the other actions that needs to be performed after the first button clicked
})