js中的window.onload链接外部js文件能不能写两次以上?即每一个js文件都用一下window.onload

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js中的window.onload链接外部js文件能不能写两次以上?即每一个js文件都用一下window.onload相关的知识,希望对你有一定的参考价值。

比如同一页面用做一个简单的无缝滚动和选项卡,怎么写都是运行一个特效,其中一个不起作用,咋办呢,求打救!

onload只能有一个,解决方案你可以写到一个onload里
或者
ie下用window.attachEvent("onload", 你的onload方法)
非ie下用window.addEventListener("load", 你的onload方法)
这样添加onload事件追问

第二种绑定的兼容方法如何写呀?在同一页面实现多个js特效,例如我上面说的,可否给详细代码,由于本人js并不是很厉害,比初学者强小小而已,谢谢~~~~

追答

把每个js里边的window.onload改成这样
if(window.attachEvent)

window.attachEvent("onload", 你的onload方法)


else

window.addEventListener("load", 你的onload方法)

追问

括号里的'你的onload方法'具体如何写呀?如果写两个或以上更多的还可以用这种方法不?迷惘着、、、

追答

function aa()//比如这个是你要加载后执行的方法
这样写
if(window.attachEvent)

window.attachEvent("onload",aa)

else

window.addEventListener("load", aa)

参考技术A window.onload 当然是写一次好了,你写几次就会有问题了

参考技术B 可以的,可以多次添加

js入口函数跟jQuery入口函数的区别

JS的window.onload事件必须要等到所有内容,以及外部图片之类的文件加载完之后,才会去执行。

JQuery入口函数是在所有标签加载完之后,就会去执行。

接着,通过JS的一个覆盖问题引出对JQuery入口函数实现的解释。

JS的入口函数window.onload函数有一个覆盖的问题,当文档中出现2个window.onload函数的时候,后者会覆盖前者,导致功能实现不了。但是JQuery却没有这样的问题,重要是因为JQuery入口函数只是对封装好了的方法的一个调用,只不过传的参数不同而已。

 

最后,说说JQuery入口函数($(document).ready();)的实现方式。

 

首先,我们在script标签中我们先创建一个函数变量就叫$,然后,在后面调用。现在并没有任何效果,因为这个调用的只是一个空的对象,没有任何参数。如果我们想在$()后面继续调用,还需要做一些事情。我们看JQuery入口函数中是不是有个ready方法,那我们可以创建一个对象的属性就叫ready,然后将ready指向一个匿名的函数,现在我们就可以通过$().ready()来调用了。

用一个具体的函数测试一下:

接着,JQuery入口函数可以传一个函数(作为变量传入)进来,即$().ready(function(){}),然后用一个形参(func)变量接收,那么严格执行接收的这个方法,只要调用一下(func())就行。

 

下面再看看JQuery入口函数前面的document参数,即$(document).ready(function(){}),这样和JQuery的入口函数就一模一样了。同样需要用一个变量接收。最后只要在ready函数里面去判断一下这个onload事件有没有(或者说有没有被赋值):

(1)有(被赋值),接收一个旧的函数,重新赋值onload事件,然后先去调用新的函数,接着再调用旧的函数,这样就不会有覆盖的问题,他俩个函数都实现了。

(2)没有,直接赋值个onload事件。

 

最后,我们来测试一下,由于document没有onload事件,我们可以用window来试一下。

这样就避免了函数覆盖的问题。

以上是关于js中的window.onload链接外部js文件能不能写两次以上?即每一个js文件都用一下window.onload的主要内容,如果未能解决你的问题,请参考以下文章

js入口函数跟jQuery入口函数的区别

js的 window.load 和window.onload 有啥区别

面试题

js window.onlload 自遐想

js相关问题:有两个js文件都有window.onload 在一个页面要同时调用这两个js要怎样解决?

JS onload