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 相关文章推荐
用js实现计算代码行数的简单方法附代码
Aug 13 Javascript
JS案例分享之金额小写转大写
May 15 Javascript
多个$(document).ready()的执行顺序实例分析
Jul 26 Javascript
JS遍历Json字符串中键值对先转成JSON对象再遍历
Aug 15 Javascript
node.js中的fs.fstatSync方法使用说明
Dec 15 Javascript
JavaScript学习心得之概述
Jan 20 Javascript
javascript鼠标滑动评分控件完整实例
May 13 Javascript
javascript比较两个日期相差天数的方法
Jul 24 Javascript
jQuery仿360导航页图标拖动排序效果代码分享
Aug 24 Javascript
jQuery+Ajax实现限制查询间隔的方法
Jun 07 Javascript
JavaScript实现实时更新系统时间的实例代码
Apr 04 Javascript
Vue动态生成表格的行和列
Jul 18 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
php采用file_get_contents代替使用curl实例
2014/11/07 PHP
PHP实现生成带背景的图形验证码功能
2016/10/03 PHP
PhpStorm的使用教程(本地运行PHP+远程开发+快捷键)
2020/03/26 PHP
用Jquery实现多级下拉框无刷新的联动
2010/12/22 Javascript
JavaScript flash复制库类 Zero Clipboard
2011/01/17 Javascript
JavaScript实现统计文本框Textarea字数增强用户体验
2012/12/21 Javascript
利用JavaScript检测CPU使用率自己写的
2014/03/22 Javascript
jQuery+css实现的蓝色水平二级导航菜单效果代码
2015/09/11 Javascript
AJAX实现瀑布流触发分页与分页触发瀑布流的方法
2016/05/23 Javascript
JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法
2016/08/03 Javascript
JS自定义函数对web前端上传的文件进行类型大小判断
2016/10/19 Javascript
微信小程序 scroll-view组件实现列表页实例代码
2016/12/14 Javascript
微信小程序 选项卡的简单实例
2017/05/24 Javascript
详解原生js实现offset方法
2017/06/15 Javascript
详细AngularJs4的图片剪裁组件的实例
2017/07/12 Javascript
详解如何让InstantClick兼容MathJax、百度统计等
2017/09/12 Javascript
JavaScript中如何判断一个值的类型
2017/09/15 Javascript
基于vue1和vue2获取dom元素的方法
2018/03/17 Javascript
vue踩坑记录之数组定义和赋值问题
2019/03/20 Javascript
小程序如何构建骨架屏
2019/05/29 Javascript
vue解决跨域问题(推荐)
2020/11/10 Javascript
对于Python装饰器使用的一些建议
2015/06/03 Python
约瑟夫问题的Python和C++求解方法
2015/08/20 Python
python画折线图的程序
2018/07/26 Python
python实现中文文本分句的例子
2019/07/15 Python
PyCharm 配置远程python解释器和在本地修改服务器代码
2019/07/23 Python
pandas 缺失值与空值处理的实现方法
2019/10/12 Python
马来西亚太阳镜、眼镜和隐形眼镜网上商店:Focus Point
2018/12/13 全球购物
夜大自我鉴定
2013/10/31 职场文书
简历中个人求职的自我评价模板
2013/11/29 职场文书
最新的咖啡店创业计划书
2013/12/30 职场文书
班级学习雷锋活动总结
2014/07/04 职场文书
博士生专家推荐信
2014/09/26 职场文书
幼儿园大班教师随笔
2015/08/14 职场文书
MySQL性能压力基准测试工具sysbench的使用简介
2021/04/21 MySQL
未发现nvidia显卡怎么办?Win11系统中未检测到nvidia显卡解决教程
2022/04/08 数码科技