jquery-10 js加载的时机如何选择
jquery-10 js加载的时机如何选择
一、总结
一句话总结：主要应用widow的ready()方法和load()方法。
1、内部文件中DOM加载完毕执行js如何书写？
把js标签放在body之后即可!
2、外部引入文件中DOM加载完毕执行js如何书写？
$(document).ready(fn);
$(fn);
多用$(fn)，这样方便快捷
$(function(){
//所有代码都是等dom加载完毕才会去执行!
});
3、内部和外部文件中资源加载完毕执行js如何书写？
window的load方法
$(window).load(function(){
//代码
});
21 $(window).load(function(){
22 w=$('img').width();
23 h=$('img').height();
24 alert(w+'-'+h);
25 });
二、js加载的时机如何选择
1、相关知识
0.js加载执行的时机
1)DOM加载完毕
把js标签放在body之后即可!
2)资源加载完毕
$(window).load(function(){
//代码
});
3)jquery中实现等dom加载完毕?
$(function(){
//所有代码都是等dom加载完毕才会去执行!
});
1.页面载入
$(document).ready(fn);
$(fn);
2、代码
资源加载完毕
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<style>
*{
font-family: 微软雅黑;
margin:0px;
padding:0px;
}
</style>
<script src="jquery.js"></script>
</head>
<body>
<div>
<img src="a.png" alt="">
</div>
</body>
<script>
$(window).load(function(){
w=$('img').width();
h=$('img').height();
alert(w+'-'+h);
});
</script>
</html>
jquery-10 js加载的时机如何选择的更多相关文章
- JQuery文档加载完成执行js的几种方法
js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...
- jquery getScript动态加载JS方法改进详解[转载]
转载自http://www.jb51.net/article/31973.htm 有许多朋友需要使用getScript方法动态加载JS,本文将详细介绍此功能的实现方法 $.getScript( ...
- jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明
jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明 jquery.lazyload.js是一个用JavaScript编写的jQuery插件.它可以延迟加载长页面中的图片 ...
- JQuery 之 动态加载JS或JS文件
如果用jquery的append直接加载script标签的话,会报错的. 1.可以用 document.write() 实现加载动态JS代码. 2.可以用 getScript() 函数实现加载JS文件 ...
- jquery getScript动态加载JS方法改进详解
有许多朋友需要使用getScript方法动态加载JS,本文将详细介绍此功能的实现方法 $.getScript(url,callback) 这个方法是jquery自身提供的一个用于动态加载js的方法.当 ...
- jQuery实现无限加载瀑布流特效
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery文档加载完毕的几种写法
js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...
- jQuery延迟加载(懒加载)插件 – jquery.lazyload.js-Web前端(W3Cways.com) - Web前端学习之路
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- jquery图片懒加载效果
1.要引入jquery 2.要引入underscore.js <!DOCTYPE html> <html lang="en"> <head> & ...
随机推荐
- 保留的 IPv4 地址
保留的IP地址 https://en.wikipedia.org/wiki/Reserved_IP_addresses 地址块(CIDR) 范围 地址数量 范围 目的 0.0.0.0/8 0.0. ...
- thinkphp缓存使用
thinkphp缓存使用 一.总结 1.这里的缓存不是指的缓存的页面,而是cache,如果你缓存了一个数组,那么你就可以取出这个数组里面的数据进行使用,用法性质和cookie和session有点像 2 ...
- 【2017中国大学生程序设计竞赛 - 网络选拔赛】Palindrome Function
[链接]http://acm.hdu.edu.cn/showproblem.php?pid=6156 [题意] 已知函数f(x, k),如果10进制数x在k进制下是个回文数,那么f(x, k)值为k, ...
- vue使用jsonp
axios不支持jsonp,所以需使用其他插件:vue-jsonp npm i vue-jsonp -S 然后在 src/main.js : import Vue from 'vue' import ...
- vue 键盘回车事件导致页面刷新的问题，路由多了一个问号
问题: <el-form @submit.native.prevent> <el-form-item > <el-input @keyup.enter.native=&q ...
- 关于Newtonsoft.json JsonConvert.DeserializeObject反序列化的使用
object obj = JsonConvert.DeserializeObject("{\"Sta\":3}", paramClass); //paramCl ...
- Android Mvvm模式的理解
1. Mvvm是什么,Mvvm是怎么来的?Mvvm模式广泛应用在WPF项目开发中,使用此模式可以把UI和业务逻辑分离开,使UI设计人员和业务逻辑人员能够分工明确. Mvvm模式是根据MVP模式来的,可 ...
- (win7/8/10)鼠标右键添加按下SHIFT键时弹出带管理员权限的“在此处打开命令窗口”
Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\Directory\Background\shell\runas]@="@sh ...
- LM4990音频功放芯片
我们选用的一种封装:我们用的是DGK封装. 典型电路图: 下面是示意图:四中封装的示意图是不一样的: 下面是真正的原理图: 高放大倍数的原理图: 查分式的: 单个输入的原理图: 下面是有关电源的选择:
- 怎样用Adobe Acrobat 7 Pro把PDF文档拆分成多个啊？
这个pdf文档里有多篇文章,我想把他们分开并分别保存在独立的pdf文档.怎么操作?我的电脑基础不太好,麻烦说得详细一些. Adobe Acrobat 7 Pro拆分PDF文档的方法: 1.点左边的“书 ...