js怎么在页面加载完成之后自动触发鼠标移入事件

JavaScript06

js怎么在页面加载完成之后自动触发鼠标移入事件,第1张

添加onmouseover 事件即鼠标移入对象时触发的时间js图片自动切换 用的是js的定时器方法吧添加onmouseover 事件方法中可以写一段脚本 终止定时器的作用。则可以停止切换onmouseout 在鼠标从元素上离开后会触发的事件 可以再写方法让定时器生效。还有什么不明白的可以追问

在Jquery里面,我们可以看到两种写法:$(function(){})

和$(document).ready(function(){})

这两个方法的效果都是一样的,都是在dom文档树加载完之后执行一个函数(注意,这里面的文档树加载完不代表全部文件加载完)。

而window.onload是在dom文档树加载完和所有文件加载完之后执行一个函数。也就是说$(document).ready要比window.onload先执行。

那么Jquery里面$(document).ready函数的内部是怎么实现的呢?下面我们就来看看:

我们来为document添加一个ready函数:

document.ready

=

function

(callback)

{

///兼容FF,Google

if

(document.addEventListener)

{

document.addEventListener('DOMContentLoaded',

function

()

{

document.removeEventListener('DOMContentLoaded',

arguments.callee,

false)

callback()

},

false)

}

//兼容IE

else

if

(document.attachEvent)

{

document.attachEvent('onreadytstatechange',

function

()

{

if

(document.readyState

==

"complete")

{

document.detachEvent("onreadystatechange",

arguments.callee)

callback()

}

})

}

else

if

(document.lastChild

==

document.body)

{

callback()

}

}

document.ready这个函数是实现了。我们再来验证一下最上面所说的“ready要比onload先执行”:

window.onload

=

function

()

{

alert('onload')

}

document.ready(function

()

{

alert('ready')

})

执行这段代码之后,你会看到浏览器里面会先弹出“ready”,在弹出onload。

这个大家还是亲手试试吧!

=============================

以上来信息源于百度搜索。。。总的来说ready比onload要先触发

有些时候需要动态加载javascript事件的一些方法

往往我们需要在

JS

中动态添加事件,这就涉及到浏览器兼容性问题了,以下谈及的几种方法,我们也常常混合使用。

方法一、setAttribute

var

obj

=

document.getElementById("obj")

obj.setAttribute("onclick",

"javascript:alert('测试')")

这里利用

setAttribute

指定

onclick

属性,简单,很好理解,

但是:IE

不支持,IE

并不是不支持

setAttribute

这个函数,而是不支持用

setAttribute

设置某些属性,包括对象属性、集合属性、事件属性,也就是说用

setAttribute

设置

style、onclick、onmouseover

这些属性在

IE

中是行不通的。

方法二、用

attachEvent

addEventListener

IE

支持

attachEvent

obj.attachEvent("onclick",

Foo)

function

Foo()

{

alert("测试")

}

也可写在一起

obj.attachEvent("onclick",

function(){alert("测试")})

其它浏览器支持

addEventListener

obj.addEventListener("click",

Foo,

false)

function

Foo()

{

alert("测试")

}

同样也可写在一起

obj.addEventListener("click",

function(){alert("测试")},

false)

注意

attachEvent

的事件带

on,如

onclick,而

addEventListener

不带

on,如

click。

顺便说一下

addEventListener

的第三个参数(虽然很少用)

useCapture

-

如果为

true,则

useCapture

指示用户希望启动捕获。启动捕获后,所有指定类型的事件将在被指派到树中其下面的任何

EventTargets

之前指派给已注册的

EventListener。正在通过树向上

bubbling

的事件将不触发指定的使用捕获的

EventListener。

综合应用

复制代码

代码如下:

if

(window.attachEvent)

{

//IE

的事件代码

}

else

{

//其它浏览器的事件代码

}

方法三、事件

=

函数

例:obj.onclick

=

Foo

这在多个浏览器中均支持,这是属于旧的规范(方法二属于

DOM2

的规范),不过由于使用方便,用的场合也比较多。

下面是我的解决办法:

复制代码

代码如下:

function

show(){

alert("Hello,

world!!!")

}

obj.setAttribute('onclick',document.all

?

eval(function(){show()})

:

'javascript:show()')