在页面中,我们有时候想让页面加载的时候有多个JS事件,一般的时候我们会这样做
window.onload=function(){
alert("aaa");
}
window.onload=function(){
alert("bbb");
}
运行结果并不是我们想要的那样,一下子弹出 aaa,然后弹出bbb
而只会弹出bbb,好像是后面的覆盖了前面的JS代码
如何实现我们的两个想要的结果呢
window.onload=function(){
a();
b();
}
function a(){
alert("aaa");
}
functiion b(){
alert("bbb")
}
这样的话会依次的弹出我们想要的结果,原理大家也应该看出来了,这个就是在加载函数中写入两个函数,用加载函数来调用这些函数。
对于上面的这种方法完全可以解决编程中的问题,但有时候我们在遇到很大的页面的时候,这种方法写起来不是很舒服,而习惯于用jQuery的方法$(document).ready(function(){}),如下
$(document).ready(function(){
alert("aaa");
alert("bbb");
})
运行这段代码,大家一定可以得到想要的结果。aaa,bbb,是不是感觉很简单,jQuery最大的作用就是简化JS,当然这段代码我们还可以再简化如下
$(function(){
alert("aaa");
alert("bbb");
})
运行结果还是很上面一样的。
大家估计也都看到了,window.onload=function(){}和$(function(){})可以火环,但是这个两个函数的执行时间不同的,前者就是页面所有的元素加载完毕后执行,而后者是遍历了所有的DOM节点加载后再执行,相比较而言后者比较‘快’;
切记后者的$符号是代表jQuery,所以必须引入jQuery的库。
有时候我们用原生的JS中也会出现$符号,但是他们代表的意义是不同的
function $(id){
obj=document.getElementById(id)
return obj;
}
docuement.getElementById("uname").value可简写$('uname').value
切记两者的$不一样,所有我们在遇到的时候一定要重新声明
例如我重新声明jQuery中的$,$在jQuery库中本身代表jQuery,希望别把你混淆。
var $$=jQuery;
$$(function(){
alert("aaa");
alert("bbb")
})