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加载的时机如何选择的更多相关文章

  1. JQuery文档加载完成执行js的几种方法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  2. jquery getScript动态加载JS方法改进详解[转载]

    转载自http://www.jb51.net/article/31973.htm 有许多朋友需要使用getScript方法动态加载JS,本文将详细介绍此功能的实现方法     $.getScript( ...

  3. jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明

    jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明 jquery.lazyload.js是一个用JavaScript编写的jQuery插件.它可以延迟加载长页面中的图片 ...

  4. JQuery 之 动态加载JS或JS文件

    如果用jquery的append直接加载script标签的话,会报错的. 1.可以用 document.write() 实现加载动态JS代码. 2.可以用 getScript() 函数实现加载JS文件 ...

  5. jquery getScript动态加载JS方法改进详解

    有许多朋友需要使用getScript方法动态加载JS,本文将详细介绍此功能的实现方法 $.getScript(url,callback) 这个方法是jquery自身提供的一个用于动态加载js的方法.当 ...

  6. jQuery实现无限加载瀑布流特效

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. jQuery文档加载完毕的几种写法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  8. jQuery延迟加载(懒加载)插件 – jquery.lazyload.js-Web前端(W3Cways.com) - Web前端学习之路

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  9. jquery图片懒加载效果

    1.要引入jquery 2.要引入underscore.js <!DOCTYPE html> <html lang="en"> <head> & ...

随机推荐

  1. Android仿Win8界面的button点击

    今天没事的时候,感觉Win8的扁平化的button还是挺好看的,就研究了下怎样在安卓界面实现Win8的扁平化button点击效果. 发现了一个自己定义的View能够实现扁平化button效果,话不多说 ...

  2. 阿里云 CentOS7.4 环境安装nginx

    下载 nginx地址: http://nginx.org/en/download.html Mainline version可以理解为开发版本 Stable version 稳定版 Legacy ve ...

  3. 用 OPENSSL 生成不同格式的密钥

    用 OPENSSL 生成不同格式的密钥 密钥 key 值包括 加密算法: RSA/DSA/ECC 加密位数: 1024/2048/4096 密钥口令:加密方式有很多 在使用 DSA/ECC 加密算法时 ...

  4. 2.Java实现基于SOAP的XML文档网络传输及远程过程调用(RPC)-

    转自:https://blog.csdn.net/a214919447/article/details/55260411 SOAP(Simple Object Access Protocol,简单对象 ...

  5. sql跳过非工作日(周末和节假日)

    简介:场景1:基于开始日期和工期,推算结束日期. 场景2:基于开始日期和结束日期,计算工期 注:需要自己做界面维护工作日表(s_WorkDay)和节假日表(s_SpecialDay) 涉及到的数据表 ...

  6. 八、Docker+RabbitMQ

    原文:八.Docker+RabbitMQ 一.下载镜像 docker pull rabbitmq:management 二.运行 docker run -d --name rabbitmq -e TZ ...

  7. 【AIM Tech Round 4 (Div. 2) B】Rectangles

    [链接]http://codeforces.com/contest/844/problem/B [题意] 也是道计数水题,没什么记录意义 [题解] 枚举每个点的位置在,然后往右往下 枚举和它一样颜色的 ...

  8. 洛谷 P2978 [USACO10JAN]下午茶时间Tea Time

    P2978 [USACO10JAN]下午茶时间Tea Time 题目描述 N (1 <= N <= 1000) cows, conveniently numbered 1..N all a ...

  9. 关于查看域名A记录,MX记录,CNAME记录-NSLOOKUP用法介绍

    关于查看域名A记录,MX记录,CNAME记录-NSLOOKUP用法介绍 用ping查看域名的IP地址,这样只能查到域名的A记录,要查询域名的MX记录.CNAME记录或NS记录,可用nslookup命令 ...

  10. Rotation--控件位置旋转

    今天想要完成一个按钮的动画,也就是随着手势在屏幕上的滑动,让按钮图片跟着旋转.刚开始的思路是,先把图片旋转以后,在把这个图片设置为imagebutton的背景.不过,会发现这个图片经过处理以后一直变形 ...