首页新闻找找看学习计划

怎么改变事件优先执行

0
悬赏园豆:10 [已解决问题] 解决于 2019-06-12 18:35

<script>

window.onload = function(){
alert(1)
document.write('<h1>1</h1>');
alert(2)
docunment.write('<h2>2</h2>')
alert(3)
docunment.write('<h3>3</h3>')

}

</script>

如何让浏览器的显示顺序 与我写的代码顺序一样

我却醉的像条狗的主页 我却醉的像条狗 | 初学一级 | 园豆:190
提问于:2019-06-12 14:13
< >
分享
最佳答案
2
window.onload = function() {
requestAnimationFrame(() => {
  document.write('<h1>1</h1>');
  requestAnimationFrame(() => {
    alert(1)
    document.write('<h1>2</h1>');
    requestAnimationFrame(() => {
      alert(2)
      document.write('<h1>3</h1>');
      requestAnimationFrame(() => {
        alert(3)
      });
    });
  });
});
}

要点: 浏览器异步渲染界面
相关知识点: JavaScript 事件循环,requestAnimationFrame

收获园豆:10
不如隐茶去 | 小虾三级 |园豆:524 | 2019-06-12 17:38
不如隐茶去 | 园豆:524 (小虾三级) | 2019-06-12 17:39

是我要的效果,谢谢了

我却醉的像条狗 | 园豆:190 (初学一级) | 2019-06-12 18:33
其他回答(2)
0

把显示写在函数里面:

<script>
    window.onload = function () {
        function first() {
            //第1个函数
            //TODO:
            //显示
            document.write('<h1>1</h1>');
        }
        function second() {
            //第2个函数
            //TODO:
            //显示
            docunment.write('<h2>2</h2>')
        }
        function third() {
            //第3个函数
            //TODO:
            //显示
            docunment.write('<h3>3</h3>')
        }
        //执行
        first();
        second();
        third();
    }
三人乐乐 | 园豆:3115 (老鸟四级) | 2019-06-12 14:38

我是想让 弹出一个弹框 然后显示1 再弹出一个框 显示2 依次类推。

支持(0) 反对(0) 我却醉的像条狗 | 园豆:190 (初学一级) | 2019-06-12 16:48
0

浏览器渲染的顺序就和你现在写的代码是一致的
不过,你不能用alert(),alert()无论放在那里都会比同等级的代码先执行(原因自己查下吧)。
我把alert()改成console.log()之后,一调试就看出效果来了

Mad_Rabbit | 园豆:305 (菜鸟二级) | 2019-06-12 15:06
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册