jQuery与JS加载事件用法分析


Posted in Javascript onSeptember 04, 2016

本文实例分析了jQuery与JS加载事件用法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>加载事件</title>
<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
</head>
<body onload="alert('js');">
<style type="text/css">
#bbb{ background-color:#039;}
</style>
<div class="aaa" id="bbb">
  无标题文档1
</div>
<div class="aaa" id="bbb">
  无标题文档2
</div>
<div class="aaa" id="bbb">
  无标题文档3
</div>
<script type="text/javascript">
//jQ 也是js来的,不同的是使用js封装是一个库,所以也叫 js 库
//jQ 把文档结构加载完后,就开始加载 jQ
//$(document).ready(function(){})可以简写成$(function(){});
$(function(){
  alert('jq');
});
$(function(){
  alert('jq2');
});
$(function(){
  alert('jq3');
});
$(function(){
  alert('jq4');
});
$(document).ready(function(){ // == $(function(){
  alert('jq5');
});
//js onload 事件会在页面或图像加载完成后立即发生。
//onload 不能同时出现两次
window.onload = function(){
  alert('js2')
}
//$(function(){});这个是在页面DOM文档加载完成后加载执行的,等效于$(document).ready(function(){...});
//优于window.onload,后者必须等到页面内包括图片的所有元素加载完毕后才能执行。
</script>
</body>
</html>

效果图:

jQuery与JS加载事件用法分析

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JavaScript中的isXX系列是否继续使用的分析
Apr 16 Javascript
js自执行函数的几种不同写法的比较
Aug 16 Javascript
js中通过split函数分割字符串成数组小例子
Sep 21 Javascript
js中小数转换整数的方法
Jan 26 Javascript
纯Javascript实现ping功能的方法
Mar 20 Javascript
HTML Table 空白单元格补全的简单实现
Oct 13 Javascript
移动端js图片查看器
Nov 17 Javascript
基于jQuery实现火焰灯效果导航菜单
Jan 04 Javascript
JavaScript中的 attribute 和 jQuery中的 attr 方法浅析
Jan 04 Javascript
javascript实现动态显示颜色块的报表效果
Apr 10 Javascript
兼容浏览器的js事件绑定函数(详解)
May 09 Javascript
解决Angular4项目部署到服务器上刷新404的问题
Aug 31 Javascript
jQuery轮播图效果精简版完整示例
Sep 04 #Javascript
jQuery实现最简单的切换图效果【可兼容IE6、火狐、谷歌、opera等】
Sep 04 #Javascript
jQuery实现的自定义弹出层效果实例详解
Sep 04 #Javascript
JS简单实现仿百度控制台输出信息效果
Sep 04 #Javascript
把多个JavaScript函数绑定到onload事件处理函数上的方法
Sep 04 #Javascript
JS简单测试循环运行时间的方法
Sep 04 #Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
Sep 04 #Javascript
You might like
PHP3 safe_mode 失效漏洞
2006/10/09 PHP
paypal即时到账php实现代码
2010/11/28 PHP
PHP把MSSQL数据导入到MYSQL的方法
2014/12/27 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
基于jquery的仿百度的鼠标移入图片抖动效果
2010/09/17 Javascript
js的window.showModalDialog及window.open用法实例分析
2015/01/29 Javascript
jquery操作复选框checkbox的方法汇总
2015/02/05 Javascript
JS实现适合于后台使用的动画折叠菜单效果
2015/09/21 Javascript
jQuery插件EasyUI校验规则 validatebox验证框
2015/11/29 Javascript
jQuery模拟物体自由落体运动(附演示与demo源码下载)
2016/01/21 Javascript
jQuery实现的精美平滑二级下拉菜单效果代码
2016/03/28 Javascript
AngularJS Bootstrap详细介绍及实例代码
2016/07/28 Javascript
微信页面倒计时代码(解决safari不兼容date的问题)
2016/12/13 Javascript
nodejs利用http模块实现银行卡所属银行查询和骚扰电话验证示例
2016/12/30 NodeJs
jQuery使用正则验证15/18身份证的方法示例
2017/04/27 jQuery
js实现登录注册框手机号和验证码校验(前端部分)
2017/09/28 Javascript
Angular 4根据组件名称动态创建出组件的方法教程
2017/11/01 Javascript
cordova+vue+webapp使用html5获取地理位置的方法
2019/07/06 Javascript
vscode中eslint插件的配置(prettier配置无效)
2019/09/10 Javascript
vue input标签通用指令校验的实现
2019/11/05 Javascript
环形加载进度条封装(Vue插件版和原生js版)
2019/12/04 Javascript
Javascript组合继承方法代码实例解析
2020/04/02 Javascript
JavaScript函数柯里化实现原理及过程
2020/12/02 Javascript
Python多线程编程(二):启动线程的两种方法
2015/04/05 Python
使用apidoc管理RESTful风格Flask项目接口文档方法
2018/02/07 Python
Python基于OpenCV库Adaboost实现人脸识别功能详解
2018/08/25 Python
python opencv判断图像是否为空的实例
2019/01/26 Python
Python 的 __str__ 和 __repr__ 方法对比
2020/09/02 Python
伊莱克斯(Electrolux)俄罗斯网上商店:瑞典家用电器品牌
2021/01/23 全球购物
幼儿园教育教学反思
2014/01/31 职场文书
收银员岗位职责
2014/02/07 职场文书
竞选体育委员演讲稿
2014/04/26 职场文书
综合实践活动报告
2015/02/05 职场文书
毕业生就业推荐表自我鉴定
2019/06/20 职场文书
jupyter notebook保存文件默认路径更改方法汇总(亲测可以)
2021/06/09 Python
Python实现日志实时监测的示例详解
2022/04/06 Python