`
qieyi28
  • 浏览: 157601 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

js和jquery 加载页面后再执行的区别

 
阅读更多

      一般加载页面后再执行javascript程序有下面几种方式

$(function(){ 
  $("#a").click(function(){ 
    //adding your code here 
  }); 
}); 

$(document).ready(function(){ 
  $("#a").click(function(){ 
    //adding your code here   
  }); 
}); 

window.onload = function(){ 
  $("#a").click(function(){ 
    //adding your code here 
  }); 
} 

    一般加载的方法是window.onload这种方式

   这个方法会在整个document加载完成后加载此方法中的代码,不仅包括DOM TREE的整个结构,还包括css和图片等等。这是特性。等下我讲优点。

   另外的是Jquery的加载方法$(function(){});$(document).ready(function(){ })这2种方法在加载时,的特性是,只要等到DOM TREE 加载完成后就会加载此方法中的代码。

  那么此时的应用是要再页面加载后进行跳转(window.location.href='****'),那么上面讲的两个方法有什么区别呢。

window.onload方式会等到页面样式图片都载入后执行,再往新的页面重定向,而jquery的方式会中断图片和样式的加载,就进行跳转。这个我是在苹果手机和安卓手机上测试发现此问题。苹果手机的默认浏览器还是正常的加载完所有图片和样式,但安卓默认的浏览器就会出现上面我讲的问题了。所以看似一样的功能,却有不同的兼容性效果。

   

分享到:
评论

相关推荐

    jquery页面加载效果

    jQuery的$(document).ready()函数用于确保这一点,只有当页面结构加载完毕后,才执行包裹在其中的代码。 2. **CSS3动画**:jQuery结合CSS3可以创建出丰富多样的动画效果,如淡入淡出、滑动等。CSS3提供了更高效、...

    页面加载完成后再执行JS的jquery写法以及区别说明

    页面加载完成后再执行JavaScript(简称JS)是网页开发中的一项重要功能。当HTML文档被解析为DOM树,CSSOM被构建,且资源如图片和外部样式表都被下载后,页面才算是完全加载完成。在这些资源完全加载之前,如果我们...

    jQuery 的加载事件

    `$(document).ready()`适用于大部分情况下的初始化操作,而`$(window).load()`和`$(window).on('load', function() {})`则更适合需要等待页面所有资源加载完成后再执行特定任务的场景。掌握这些方法能够帮助我们更好...

    jquery-3.1.1.js和jquery-3.1.1.min.js

    例如,使用`$(document).ready()`确保在页面完全加载后执行初始化代码,使用`.click()`绑定点击事件,以及使用`.data()`来存储和检索附加数据。 总的来说,`jquery-3.1.1.js`和`jquery-3.1.1.min.js`是jQuery库的两...

    jquery加载页面的方法(页面加载完成就执行)

    在Web开发中,页面加载完成后执行特定JavaScript代码是一个常见需求。原生JavaScript提供了window.onload事件,而jQuery库通过简化和扩展这一功能提供了自己的方式。本文将详细介绍如何使用jQuery来加载页面,并在...

    Firebug控制台动态加载jquery脚本并执行jquery代码

    6. **扩展应用**:除了在Firebug控制台中使用,这种动态加载和执行jQuery的方法还可以应用于实际的JavaScript代码中,特别是在你需要在用户交互后或者页面加载的某个特定阶段引入jQuery时。 了解了这些概念后,你...

    jquery前台logo页面

    此外,考虑到SEO(搜索引擎优化)和性能优化,可能还会使用`$(document).ready()`或`$(function() {...})`确保在DOM加载完成后再执行JavaScript代码,防止阻塞页面渲染。同时,将大的JavaScript文件压缩和合并也是...

    jQuery.js执行过程分析

    这一设计确保了即使页面中包含多个jQuery脚本文件,也只会有一个jQuery实例被加载和使用。 2. **构造函数与命名空间**: jQuery定义了一个构造函数,同时通过`window.$ = jQuery;`将jQuery绑定到全局变量`$`,方便...

    jQuery.spin.js自定义页面加载Loading动画代码

    jQuery.spin.js就是一个这样的插件,它允许开发者自定义页面加载的Loading动画效果,提供了一种优雅的方式来提升用户体验。 jQuery是一个广泛使用的JavaScript库,它的易用性和丰富的功能使其成为网页开发的首选...

    jquery.hash.min.js 和 jquery.ba-hashchange.min.js

    而 `jquery.hash.min.js` 和 `jquery.ba-hashchange.min.js` 这两个文件则是在 jQuery 基础上扩展了对浏览器 URL hash 变化的处理,从而实现单页面应用(Single Page Application, SPA)中后退和前进按钮的刷新功能...

    jquery-3.5.1.min.js_jquery-3.5.1.min.js_jquery_

    标题中的“jquery-3.5.1.min.js”代表的是jQuery库的3.5.1版本的压缩后的最小化文件,这种格式的文件通常用于实际生产环境中,以减小页面加载时间。"jquery-3.5.1.min.js"是这个特定版本的核心文件,包含了所有...

    jquery页面跳转loading加载

    当用户点击链接时,jQuery会阻止默认的页面跳转,显示loading效果,然后在指定的延迟时间后,再执行实际的页面跳转。 此外,标签"源码"和"工具"暗示了可能有关于代码实现和辅助工具的内容。在实际开发中,开发者...

    jquery应用子页面在父页面打开

    1. **事件监听**:jQuery提供了丰富的事件处理函数,例如`$(window).load()`或`$(document).ready()`,可以确保在子页面完全加载后执行特定的代码。这样,我们可以监听子页面的加载完成,然后执行父页面的相关操作。...

    jquery-1.11.1.js 、jquery-1.11.1.min.js 【官方jquery包 js】

    压缩后的`jquery-1.11.1.min.js`通过删除注释、合并变量、压缩代码等方式,显著减少了文件大小,提高了页面加载速度。然而,由于代码被高度压缩,不适合用于调试,因为其可读性较差。 8. **使用场景** jQuery广泛...

    jquery-2.0.3.js和jquery-2.0.3.min.js

    而`jquery-2.0.3.min.js`则是经过压缩和优化的版本,适用于生产环境,以减少网络传输时间和提高页面加载速度。 总结来说,jQuery 2.0.3作为一款强大的JavaScript库,不仅提供了丰富的功能,而且在性能和代码简洁性...

    jQuery懒加载插件页面滚动加载数据代码

    jQuery懒加载插件是一种优化网页性能的技术,它允许我们在用户滚动页面时按需加载内容,而不是一次性加载所有数据。这种技术对于拥有大量图片、视频或动态数据的网页尤其有用,因为它减少了初始页面加载时间,提高了...

    jquery-1.9.1.min.js_javascript_jquery_

    jQuery 1.9.1.min.js 是这个库的一个特定版本,经过压缩优化,用于在实际网站上提高性能和减少页面加载时间。 **jQuery 的主要特性** 1. **DOM 操作**:jQuery 提供了一套方便的函数来选择、遍历和操作HTML元素。...

    jquery-2.1.4.js 、jquery-2.1.4.min.js 【jquery包 js】

    这个文件去除了不必要的空格和注释,降低了文件大小,从而提高了页面加载速度。由于进行了混淆,代码变得难以阅读,但这并不影响其执行效率,因为浏览器仍能正确解析和执行。 jQuery主要包含以下核心功能: 1. **...

    jquery-3.0.0.js 、jquery-3.0.0.min.js 【官方jquery包 js】

    1. 文件大小:`.min.js`是经过压缩和混淆后的版本,文件大小显著减小,有利于提高页面加载速度,降低用户等待时间。 2. 代码优化:通过删除注释、合并变量、缩短函数名等手段,`.min.js`在不牺牲功能的前提下,实现...

    jquery-2.0.0.js 、jquery-2.0.0.min.js 【官方jquery包 js】

    如`jquery-2.0.0.js`和`jquery-2.0.0.min.js`,后者是经过压缩后的版本,更适合生产环境使用。 - **更好的DOM操作**:jQuery 2.0.0进一步增强了选择器引擎,提升了对CSS3选择器的支持,使得开发者能更方便地选取和...

Global site tag (gtag.js) - Google Analytics