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 面向对象编程(1) 基础
May 18 Javascript
js返回前一页刷新本页重载页面
Jul 29 Javascript
深入理解JavaScript系列(27):设计模式之建造者模式详解
Mar 03 Javascript
jQuery实现输入框下拉列表树插件特效代码分享
Aug 27 Javascript
Javascript表单特效之十大常用原理性样例代码大总结
Jul 12 Javascript
基于JSON格式数据的简单jQuery幻灯片插件(jquery-slider)
Aug 10 Javascript
学习vue.js计算属性
Dec 03 Javascript
JS+HTML5 FileReader对象用法示例
Apr 07 Javascript
Angularjs中ng-repeat的简单实例
Aug 25 Javascript
vue弹窗组件使用方法
Apr 28 Javascript
JS实现的tab切换并显示相应内容模块功能示例
Aug 03 Javascript
json.stringify()与json.parse()的区别以及用处
Jan 25 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
PHP5/ZendEngine2的改进
2006/10/09 PHP
递归列出所有文件和目录
2006/10/09 PHP
Joomla下利用configuration.php存储简单数据
2010/05/19 PHP
php echo, print, print_r, sprintf, var_dump, var_expor的使用区别
2013/06/20 PHP
PHP中cookie和session的区别实例分析
2014/08/28 PHP
php使用fputcsv()函数csv文件读写数据的方法
2015/01/06 PHP
PHP中array_keys和array_unique函数源码的分析
2016/02/26 PHP
php基于协程实现异步的方法分析
2019/07/17 PHP
如何在PHP环境中使用ProtoBuf数据格式
2020/06/19 PHP
整理一些JavaScript的IE和火狐的兼容性注意事项
2011/03/17 Javascript
JavaScript对象的property属性详解
2014/04/01 Javascript
特殊情况下如何获取span里面的值
2014/05/20 Javascript
JS中getYear()和getFullYear()区别分析
2014/07/04 Javascript
javascript中setInterval的用法
2015/07/19 Javascript
js实现点击按钮弹出上传文件的窗口
2016/12/23 Javascript
javascript获取以及设置光标位置
2017/02/16 Javascript
Angular1.x复杂指令实例详解
2017/03/01 Javascript
JavaScript定时器设置、使用与倒计时案例详解
2019/07/08 Javascript
bootstrap table插件动态加载表头
2019/07/19 Javascript
layui实现下拉框三级联动
2019/07/26 Javascript
python使用win32com在百度空间插入html元素示例
2014/02/20 Python
Python内置的HTTP协议服务器SimpleHTTPServer使用指南
2016/03/30 Python
对Python中range()函数和list的比较
2018/04/19 Python
详解Python如何生成词云的方法
2018/06/01 Python
python3安装speech语音模块的方法
2018/12/24 Python
Python使用指定字符长度切分数据示例
2019/12/05 Python
python DataFrame转dict字典过程详解
2019/12/26 Python
浅析Python 序列化与反序列化
2020/08/05 Python
python 制作网站小说下载器
2021/02/20 Python
使用CSS3来代替JS实现交互
2017/08/10 HTML / CSS
欧洲最大的预定车位市场:JustPark
2020/01/06 全球购物
汇科协同Java笔试题
2012/03/31 面试题
2016年师德学习心得体会
2016/01/12 职场文书
2016党员党章学习心得体会
2016/01/14 职场文书
个人销售励志奋斗口号
2019/12/05 职场文书
mybatis 解决从列名到属性名的自动映射失败问题
2021/06/30 Java/Android