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中parseFloat(参数1,参数2)定义和用法及注意事项
Jan 27 Javascript
检查输入的是否是数字使用keyCode配合onkeypress事件
Jan 23 Javascript
JavaScript函数详解
Feb 27 Javascript
在JavaScript中处理数组之reverse()方法的使用
Jun 09 Javascript
不同js异步函数同步的实现方法
May 28 Javascript
jQuery实现文档树效果
Feb 20 Javascript
原生JS改变透明度实现轮播效果
Mar 24 Javascript
详解从angular-cli:1.0.0-beta.28.3升级到@angular/cli:1.0.0
May 22 Javascript
JS分页的实现(同步与异步)
Sep 16 Javascript
vue ssr 指南详读
Jun 29 Javascript
vue下axios拦截器token刷新机制的实例代码
Jan 17 Javascript
详解Vue之计算属性
Jun 20 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
?生?D片??C字串
2006/12/06 PHP
给php新手谈谈我的学习心得
2007/02/25 PHP
字母顺序颠倒而单词顺序不变的php代码
2010/08/08 PHP
php文件扩展名判断及获取文件扩展名的N种方法
2015/09/12 PHP
Js中sort()方法的用法
2006/11/04 Javascript
JS操作JSON要领详细总结
2013/08/25 Javascript
jQuery中die()方法用法实例
2015/01/19 Javascript
浅谈javascript中this在事件中的应用
2015/02/15 Javascript
超级简单实现JavaScript MVC 样式框架
2015/03/24 Javascript
JavaScript实现控制打开文件另存为对话框的方法
2015/04/17 Javascript
你不需要jQuery(三) 新AJAX方法fetch()
2016/06/14 Javascript
想学习javascript JS和jQuery哪个重要 先学哪个
2016/12/11 Javascript
canvas实现图像放大镜
2017/02/06 Javascript
Node.js操作redis实现添加查询功能
2017/05/25 Javascript
小程序表单认证布局及验证详解
2020/06/19 Javascript
跟老齐学Python之私有函数和专有方法
2014/10/24 Python
Python的Django框架中的Context使用
2015/07/15 Python
用python3教你任意Html主内容提取功能
2018/11/05 Python
记一次python 内存泄漏问题及解决过程
2018/11/29 Python
深入浅析python 协程与go协程的区别
2019/05/09 Python
Python一键安装全部依赖包的方法
2019/08/12 Python
python多项式拟合之np.polyfit 和 np.polyld详解
2020/02/18 Python
Django 实现将图片转为Base64,然后使用json传输
2020/03/27 Python
Django xadmin安装及使用详解
2020/10/26 Python
详解css position 5种不同的值的用法
2019/07/30 HTML / CSS
html5的新增的标签和废除的标签简要概述
2013/02/20 HTML / CSS
Maje德国官网:法国女性成衣品牌
2017/02/10 全球购物
全球性的在线婚纱礼服工厂:27dress.com
2019/03/21 全球购物
Linux面试经常问的文件系统操作命令
2015/11/05 面试题
运动会领导邀请函
2014/02/05 职场文书
大学生村官考核材料
2014/05/23 职场文书
地质工程专业毕业生求职信
2014/08/08 职场文书
爱岗敬业事迹材料
2014/12/24 职场文书
2015年父亲节寄语
2015/03/23 职场文书
技能培训通讯稿
2015/07/18 职场文书
创业计划书之餐饮馄饨店
2019/07/18 职场文书