`

JQ ready()和onload的加载耗时

 
阅读更多
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="js/jquery-1.10.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
   var startTime = new Date().getTime();
   $(document).ready(function(){
		test1();
  })
	
  function test1(){
      var endTime2  = new Date().getTime(); 
	  var a = endTime2 - startTime;
	  $("<div>jQuery的ready() : "+a+" ms</div>").appendTo("body");
  }

  function test2(){
       var endTime1  = new Date().getTime();
	   var b = endTime1 - startTime;
	   $("<p>JavaScript的window.onload : "+b+" ms</p>").appendTo("body");
  }
</script>
</head>
<body  onload="test2();">
	<img src="img/demo.jpg" style="width:200px;height:200px;"/>
</body>
</html>

 

效果图:

 

 

 

 

  • 大小: 97.4 KB
分享到:
评论

相关推荐

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

    根据给定的文件信息,我们可以了解到,文档的标题是“jQuery ready()和onload的加载耗时分析”,而描述则说明了文档内容主要是对比分析了jQuery中的ready()函数和JavaScript的window.onload事件处理程序在页面加载时...

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

    JQuery onload、ready 方法详细解说 ...JQuery 的 onload 和 ready 方法都是在页面加载完成后触发的事件,但是它们之间有着一定的区别。在实际开发中,我们需要根据实际情况选择使用哪种事件,并注意其优点和缺点。

    ie中 body onload 和 window onload 解决法案

    总的来说,了解和掌握`body.onload`和`window.onload`的区别和用法,有助于优化网页加载和交互体验,提高用户满意度。在实际项目中,根据需求选择合适的事件,或者结合使用,能够更好地控制页面的加载顺序和执行时机...

    domino xpages 文档开发 onload加载和其它方法

    在Domino XPages开发中,理解并掌握文档加载和各种事件处理方法对于创建高效、响应式的用户界面至关重要。本文将详细探讨`onload`加载事件以及其他相关JavaScript方法,特别是如何在XPages环境中有效地使用它们。 ...

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

    起初以为是和本身onload加载的方法冲突。网上普遍的说法是$(document).ready()是在页面DOM解析完成后执行,而onload事件是在所有资源都准备完成之后才执行,也就是说$(document).ready()是要在onload之前执行的,...

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

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

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

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

    脱离document.onload和window.onload的onload事件

    脱离document.onload和window.onload的onload事件,可多次添加加载事件!

    js的image onload事件使用遇到的问题

    在Web前端开发中,onload事件是一个非常重要的概念,主要用于处理图片或者其他资源加载完成后的操作。 首先,我们来了解一下onload事件。onload事件是当图像或其他资源完全加载后触发的事件。在JavaScript中,我们...

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

    在W3C标准中,DOMContentLoaded事件与ready事件类似,它会在DOM完全加载和解析完成后触发,而不必等待样式表、图片和子框架的加载完成。这为开发者提供了更好的灵活性和控制能力。现在许多流行的JavaScript库(例如...

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

    在前端开发中,页面加载完成的事件处理是一项基础且重要的工作。传统的DOM操作中,我们使用的是onload事件,而随着jQuery的...在实际的前端开发中,合理地选择使用onload和ready可以大幅度提升页面加载和交互的性能。

    JavaScript与Image加载事件(onload)、加载状态(complete)

    JavaScript中的Image对象是一个强大的工具,用于处理图像加载和显示。在网页开发中,我们经常需要动态加载图片,这时就需要利用到Image对象的加载事件(onload)和加载状态(complete)属性。这两个特性可以帮助我们...

    jQuery mobile在页面加载时添加加载中效果 document.ready 和[removed]执行顺序比较

    首先,了解jQuery Mobile框架中关于页面加载和事件处理的知识点是非常重要的。页面加载分为DOM加载和资源加载(例如图片、脚本等)两个部分。在常规的Web开发中,页面加载完成通常是指DOM结构构建完毕,但实际上用户...

    document.ready和window.onload.docx

    windows

    Jquery 在页面加载后执行的几种方式

    与`$(document).ready()`不同的是,`window.onload`只能被调用一次,并且需要等待页面上所有资源加载完成,因此它会在`$(document).ready()`之后执行。 ```javascript window.onload = function() { // 你的代码 }...

    js onload处理html页面加载之后的事件

    实际上,页面加载完毕之后的事件处理常常和JSON数据的加载有关,因为页面加载完成后可能需要从服务器获取数据,并将这些数据动态地加载到页面中。不过,基于文章内容的限制,无法提供相关的具体知识点,但可以简单...

Global site tag (gtag.js) - Google Analytics