`

ready与onload

jQueryJavaScriptHTML 
阅读更多

问题：
    首页控制多个图片切换效果js引用时可以正常显示，进入二级页面时切换效果不起作用。

 

经核查，发现是js加载函数window.onload=function(){}出现了问题，将其改为$(document).ready(function(){}后，问题就解决了！

 

查阅资料后了解到：

      1.window.onload的意思是当页面加载完毕的时候执行，而jquery的ready则是指在页面的DOM模型加载完后执行指定的函数；

      2.ready肯定在onload之前发生，页面加载大或者多的图片而使onload执行延后，使用jquery的ready可缓解此问题；

      3.可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照（代码中的）先后顺序依次执行。

 

测试demo:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>测试用的</title>
</head>
<script type = "text/javascript" src= "jquery-1.3.2.min.js"></script>
<script type = "text/javascript">
$(document).ready(function(){
	alert(111);
});
$(document).ready(function(){
	alert(112);
});

window.onload = function(){
	alert(222);
}
window.onload = function(){
	alert(223);
}
</script>

<body>

</body>
</html>

测试结果
111  112  223

 

1
顶
0
踩
分享到：
| 字符串截取函数（避免utf8编码截取半个字符 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JQuery-- onload，ready方法详细解说

    与 onload 事件相比，ready 事件有很多优点。例如，在 onload 事件中，我们只能加载一个函数，而在 ready 事件中，我们可以加载多个函数，这样可以使得代码更加灵活和易维护。另外，在 onload 事件中，代码和内容不...

    JQ ready()和onload的加载耗时

    `$(document).ready()`与`window.onload`的主要区别在于执行时机。`ready`更早，它允许更快地访问和操作DOM，提高用户体验。而`onload`则确保了所有资源加载完毕，适用于那些依赖所有资源的场景，如图片计数、页面...

    浅析$(function) ready和onload 的区别

    1. **执行时机**：`$(function)`（`document.ready`）在DOM准备就绪时执行，而`onload`在所有资源（包括图像和脚本）加载完成后执行。 2. **可绑定次数**：`$(function)`可以被多次调用并执行，而`onload`事件只能有...

    jQuery ready()和onload的加载耗时分析

    通过以上分析，可以看出，文档所涉及的知识点不仅仅是关于document.ready()和onload的耗时分析，还包括了对于jQuery快速入门、优化页面加载时间、提高页面交互体验的技巧与方法，以及如何利用jQuery丰富的API库来...

    jquery的$(document).ready()和onload的加载顺序

    网上普遍的说法是$(document).ready()是在页面DOM解析完成后执行，而onload事件是在所有资源都准备完成之后才执行，也就是说$(document).ready()是要在onload之前执行的，尤其当页面图片较大较多的时候，这个时间差...

    JQuery onload、ready概念介绍及使用方法

    页面加载完成有两种事件，一是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件），二是onload，指示页 面包含图片等文件在内的所有元素都加载完成。(可以说：ready 在onload 前加载！！！) 一般样式...

    JQuery的ready函数与JS的onload的区别详解

    JQuery的ready函数与JS的onload的区别：1.执行时间[removed]必须等到页面内包括图片的所有元素加载完毕后才能执行。$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。 2.编写个数不同[removed]不能...

    a1392558812#myShare#28.query_区别onload与ready1

    window.onload与$(function(){})区别包括页面所有的图片加载完成才会回调(晚)只能有一个监听回调页面加载完成就回调(早)可以有多个监听。

    jQuery(document).ready(function($) { });的几种表示方法

    **第五种：jQuery的`$(document).ready()`与`window.onload()`的区别** - `$(document).ready()`在DOM元素加载完毕后立即执行，不需要等待所有资源（如图片、CSS等）加载完成。 - 相比之下，`window.onload()`需要...

    解析页面加载与js函数的执行 onload or ready

    但window.onload并非一无是处，比如在内容较少的页面，可能根本不需要使用document.ready()，直接使用window.onload即可。 ready事件： ready事件是在DOM结构构建完成后就触发，不需要等待图片等其他资源加载完成。...

    Jquery知识点一 Jquery的ready和Dom的onload的区别

    传统的DOM操作中，我们使用的是onload事件，而随着jQuery的流行，我们更多地使用ready函数来完成相似的功能。那么，ready和onload之间的区别到底在哪里？它们各自的使用场景又是如何呢？ 首先，让我们来解释一下...

    document.ready和window.onload.docx

    windows

    一张表格告诉你windows.onload()与$(document).ready()的区别

    - 如果你仍然需要在所有资源加载完成后执行某些操作，jQuery 提供了 `$(window).load(function() {...})`，这与 `window.onload` 相似，但提供了jQuery的链式操作和其他便利。 总结来说，选择 `window.onload()` ...

    全面解析jQuery $(document).ready()和JavaScript onload事件

    这两个阶段分别对应了jQuery中的$(document).ready()方法和JavaScript的onload事件。 $(document).ready()是jQuery提供的一个方法，它允许我们在DOM结构完全加载并且解析后立即执行代码。在描述中提到，$(document)...

Magicbox
Global site tag (gtag.js) - Google Analytics