jquery中read与js中onload区别
在JavaScript中,onload函数是最经常使用的,几乎涉及到JavaScript的童鞋都少不了要接触它。这个函数的作用就是等待网页完全装载完了以后再去执行代码块内的语句,因为按照文档流的执行顺序,通常用于头部加载JavaScript的时候需要用到。
|
1
2
3
|
window.onload = function(){ // 当网页加载完成后执行这里的代码块}; |
而在jQuery中也有一个对应的函数,即等待网页加载完后执行代码块
|
1
2
3
|
$(document).ready(function(){ // 当网页加载完成后执行这里的代码块 }); |
以上这两个看似一样的功能,但实际有很大的区别
onload不仅在创建DOM树之后,而且在所有外部资源全部加载完毕,并且整个页面在浏览器窗口中显示完毕之后,才会执行。这些资源不仅包括图片资源,而且包括嵌入在页面上的flash视频,如果图片或者flash过多,那么会一段很长加载时间,也就意味这延迟执行代码块的时间会更多。
jQuery中的ready()方法只需要等待文档结构被完全解析并且浏览器已经把HTML转化为DOM树后就会执行代码块,这里注意的是仅仅是DOM,网页中的图片,flash等外部资源都毫无关联。
由此可见jQuery中的ready()方法将缩短等待时间。
当然还有另外一种方式,就是把脚本都在<body>标签后面,这样的话网页按照文档流顺序执行,也会达到JavaScript中onload或者jQuery中ready()效果,并且这中方式将更快的展现网页内容。
jquery中read与js中onload区别的更多相关文章
- php中向前台js中传送一个二维数组
在php中向前台js中传送一个二维数组,并在前台js接收获取其中值的全过程方法: (1),方法说明:现在后台将数组发送到前台 echo json_encode($result); 然后再在js页面中的 ...
- javascript中,一个js中的函数,第一句var _this = this;为什么要这样做?
javascript中,一个js中的函数,第一句var _this = this;为什么要这样做? 下面是源码: 下面这段代码是常用的网站首页,自动切换span或者tabbar来变更List显示内容的 ...
- jq中$(function(){})和js中window.onload区别
先看下执行代码: $(function(){ console.log("jq");}) $(function(){ console.log("jq1") ...
- JQuery中width和JS中JS中关于clientWidth offsetWidth scrollWidth 等的含义
JQuery中: width()方法用于获得元素宽度: innerWidth()方法用于获得包括内边界(padding)的元素宽度: outerWidth()方法用于获得包括内边界(padding)和 ...
- 如何将一个对象存到网页中并在js中使用
需求:希望在js中使用Controller传过来的对象,特别是对象里存有list的数据. 不希望循环使用隐藏域. 解决办法:在View中使用Json.Net序列化: @{ string jsonStr ...
- 在vue项目中的main.js中直接使用element-ui中的Message 消息提示、MessageBox 弹框、Notification 通知
需求来源:向后台请求数据时后台挂掉了,后台响应就出现错误,不做处理界面就卡住了,这时需要在main.js中使用axios的响应拦截器在出现相应错误是给出提示.项目使用element-ui,就调用里面的 ...
- jquery中data()和js中dataset属性的区别
INTRO html的标签属性data-允许用户自定义属性.原生javascript和jquery分别定义了dataset属性和data()方法对标签中的data属性进行操作. 取值: 如我们定义这样 ...
- unity3d中C#与JS的一些区别
unity3d目前支持C#和JS两种脚本语言. 学习过程中发现很多教程使用的是JS语言,自己还是用C#比较多,unity原生使用的是Mono,使用C#会更加接近unity的编程思想. 1.方法的定义, ...
- jquery学习-document.ready和document.onload区别
$(function(){}) 和$(document).ready(function(){}的作用一样,表示在document树加载完之后执行一个函数. $(document).onload(fun ...
随机推荐
- 【Robot Framework 介绍】总纲
Robot Framework是一个由python构建的的开源的自动化测试框架,现在版本还在不停的更新中.由于它开源性,网上有大量的第三方接口和很多资料.下面提供两个比较官方的链接,有兴趣的同学可以直 ...
- 【PAT】1025. PAT Ranking (25)
题目链接:http://pat.zju.edu.cn/contests/pat-a-practise/1025 题目描述: Programming Ability Test (PAT) is orga ...
- 协方差cov
摘录wiki如下(红色字体是特别标注的部分): http://zh.wikipedia.org/wiki/%E5%8D%8F%E6%96%B9%E5%B7%AE 协方差 协方差(Covariance) ...
- C读txt到二维数组
#include<stdio.h> #include<stdlib.h> #define maxn 200 void main() { FILE *fp; int s[maxn ...
- 电子科大POJ "孤单整数"
孤单整数 Time Limit: 3000/1000MS (Java/Others) Memory Limit: 65535/65535KB (Java/Others) C-sources: ...
- flex-linkbutton
LinkButton 控件是没有边框的 Button 控件,当用户将鼠标移动到该控件位置时,其内容将加亮显示.这些特征通常借助包含在浏览器页面中的 HTML 链接进行展示.为使 LinkButton ...
- wxpyhon 鼠标事件例子
#encoding:utf-8 import wx import wx.aui class MyFrame(wx.Frame): def __init__(self, *args, **kwargs) ...
- C# 设计模式 - 单例模式 演示
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- asp.net中的绝对路径和相对路径
一.关于相对路径和绝对路径相对路径转绝对路径一般,我们在ASP.NET网站中往往需要把一个相对路径转化为绝对路径.通常是用Server.MapPath()方法.比如网站根目录下有 个"Upl ...
- 何使用CSS写出一个下拉菜单。
导航菜单是每个网站所必备的功能,也是每个学习制作网站的朋友所必须接触的,如何用css样式制作一个简单漂亮的二级下拉菜单呢? 下面为大家分享一下我的经验 方法步骤: 第一步 : 首页我们打开Subli ...