window.onload不能正常执行

简介: window.onload不能正常执行

第一天的需求写了一个window.onload ,可以正常执行,第二天加了一个类似的需求,为了分开各个功能,我copy了前一天的代码,完成了功能,没有进行测试,直接上线,导致原来的代码无法运行,就像下面的代码一样

<script>
  // 第一天写的代码
  window.onload = function () {
    console.log("window.onload1");
  };

  // 第二天加的需求
  window.onload = function () {
    console.log("window.onload2");
  };
</script>

控制台只能打印

window.onload2

两次赋值window.onload ,第一次的值被第二次的值给覆盖了,所以第一个函数并没有执行

正确的写法应该是

<script>

function func1() {
console.log("window.onload1");
}

function func2() {
console.log("window.onload2");
}

// 只能有一个`window.onload`
window.onload = function () {
func1();
func2();
};
</script>

可以得到期望的输出

window.onload1
window.onload2
            </div>
目录
相关文章
|
5月前
|
JavaScript 前端开发
$(document).ready()方法和window.onload有什么区别?
$(document).ready()方法和window.onload有什么区别?
40 0
|
10月前
|
JavaScript 前端开发
window.setTimeout() 和window.setInterval() 的用法与区别
window.setTimeout() 和window.setInterval() 的用法与区别
52 0
window.onload不能正常执行
window.onload不能正常执行
122 0
|
前端开发
前端面试题:1.页面加载完成(onload)之前触发的事件;2.History,Location,Window,Navigation的区别;3.e.target和e.currentTarget的区别
★Navagator:提供有关浏览器的信息 ★Window: Window对象处于对象层次的最顶层, 它提供了处理Navagator窗口的方法和属性 ★Location:提供了与当前打开的URL-工作的方 法和属性,是一个静态的对象 ★History:提供了与历史清单有关的信息 ★Document:包含与文档元素一起工作的对象,它将这些元素封装起来供编程人员使用
256 0
|
JavaScript 前端开发
|
机器学习/深度学习 JavaScript 前端开发
浏览器事件window.onload、o…
原文地址:浏览器事件window.onload、onfocus、onblur、onscroll和resize作者:lilyxiao Sample Page!   载入文档:   取得焦点:   失去焦点:   拖动滚动条:   变换尺...
1205 0