javaScript 中的加载方式

window.onload = function() {// ...
};

执行时机：所有的DOM节点加载完毕之后调用，包括资源加载，比如图片
执行次数：此处是 = 赋值，所以后面的会覆盖前面的函数内容，调用多次，只会执行最后一次
简写方案：无

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><script>// js 中的加载方式window.onload = function () {console.log('onload1')};window.onload = function () {console.log('onload2')};</script>
</body>
</html>

运行结果：只执行了最后一次的函数内容

jQuery 中的加载方式

$(document).ready(function () {// ...
});

执行时机：所有的DOM节点加载完毕之后调用，不包括资源加载

开发实际应用：做图片轮播器时，没有必要等待所有的图片加载完成才开始滚动

执行次数：可以执行多次，第N次都不会被上一次覆盖；ready() 函数会把内部接收到的函数保存到一个数组里面，等后期统一执行，所以，调用多次，就有多次执行。

简写方案：

$(function () { // ...
});

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-3.3.1.min.js"></script><script>// jQuery 中的加载方式$(document).ready(function () {console.log('ready1')});$(document).ready(function () {console.log('ready2')});$(document).ready(function () {console.log('ready3')});$(function () {console.log('ready4')});</script></body>
</html>

运行结果：所有的函数内容都被执行了

【jQuery笔记Part1】03-jQuery加载模式对比JS相关推荐

利用 JQuery的load函数动态加载页面
利用JQuery的load函数动态加载页面 JQuery有好多Ajax函数,其中load是用来动态加载一个页面的内容到指定的dom元素上. 我们来做个例子: 做一个上下(左右)结构的页面,其中下左部分 ...
Jquery背景图片的预加载
Jquery背景图片的预加载 //定义预加载图片列表的函数(有参数) jQuery.preloadImages = function(){ //遍历图片 for(var i = 0; i&l ...
JQuery 加载 CSS、JS 文件
JS 方式加载 CSS.JS 文件: //加载 css 文件 function includeCss(filename) {var head = document.getElementsByTagNa ...
网页动态加载图片通过JS和jquery实现。
;(function($){$.fn.extend({scrollLoad:function(options){var options = $.extend({src:'xsrc', //预加载在&l ...
[转]jquery的ajax交付时“加载中”提示的处理方法
本文转自:http://www.educity.cn/wenda/77121.html jquery的ajax提交时"加载中"提示的处理方法方法1:使用ajaxStart ...
ajax加载多次很卡,使用JQuery UI选项卡多次加载Ajax内容
嗨我基本上是通过单独的JQueryUI选项卡中的AJAX调用单个php页面(及其表单).该代码是这样的:使用JQuery UI选项卡多次加载Ajax内容 Home Profile Statistic ...
JQuery实现网页图片懒加载
使用img标签加载图片,在网页上显示图片,这里就简单的设置一下样式了,主要目的是展示图片的不同加载方式. 1.普通实现方式普通的实现方式就是不做任何处理,需要使用到图片时就去加载图片,这些图片一般存 ...
Jquery TimePicker时间箭头无法加载的问题（http://localhost:8080/css/images/ui-icons_444444_256x240.png）...
jquery的timepicker插件无法加载显示出左右时间箭头,原因就是缺少了png图片(ui-icons_444444_256x240.png),百度搜索搜的我头都大了... 1.去你工程的css ...
好看的html登录遮罩提示加载中,jQuery炫酷页面预加载Loading特效插件
fakeLoader.js是一款轻量级的 jQuery 炫酷页面预加载Loading特效插件.它能帮助我们创建一个全屏遮罩效果的旋转loading效果来模拟页面预加载过程. Bower安装 bower ...

【jQuery笔记Part1】03-jQuery加载模式对比JS

jQuery加载模式对比JS

javaScript 中的加载方式

jQuery 中的加载方式

【jQuery笔记Part1】03-jQuery加载模式对比JS相关推荐

最新文章

热门文章