JQuery 学习笔记01 JQuery初接触


Posted in Javascript onMay 06, 2010

一、下载
官方网址是http://jquery.com/
官方下载地址:http://docs.jquery.com/Downloading_jQuery
里边有当前版本和历史版本的下载,可以下载下来部署在自己的服务器上
上面也有Google\Microsoft\jQuery的CDN(Content Delivery Network)地址,由于目前jQuery的广泛使用,选择CDN地址可以充分利用缓存和这些互联网大佬们的带宽和服务器资源。
官网上下载有两种版本Compressed(Minified version)和Uncompressed(Source version)
前者体积小70k左右,还不到未压缩版本的一半大小。
但是未压缩版本更容易阅读源代码,以及调试
二、安装
安装jQuery非常简单 只需在HTML中引用你下载的那个js文件即可
比如     <script type="text/javascript" src="/jslibs/jquery.min.js"></script>
如果使用CDN 就直接引用<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
三、第一个程序

<!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> 
<title></title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function() { alert("hello"); }) 
</script> 
</head> 
<body> 
</body> 
</html>

刷新页面后 就可以执行了。
刚开始可能对$有点不适应,其实用不了多久就会习惯,并且喜欢它的简洁。如果实在吃不消,“$”也可以用“jQuery”代替

$(function() { alert("hello"); })

相当于
$(document).ready(function() { alert("hello"); })

也基本相当于

document.onready = function() {alert("hello");}

也就是说当浏览器把文档结构完全解析后,就可以执行下面的语句了。
与document.onload的区别在于,onload不但需要解析完文档结构,还要等待所有需要加载的内容加载完毕(比如图片等)
因为$(document).ready(fn)的频繁使用,所以可以简化为$(fn)

Javascript 相关文章推荐
javascript编程起步(第七课)
Feb 27 Javascript
js 目录列举函数
Nov 06 Javascript
stream.js 一个很小、完全独立的Javascript类库
Oct 28 Javascript
js实现按Ctrl+Enter发送效果
Sep 18 Javascript
js clearInterval()方法的定义和用法
Nov 11 Javascript
JS针对浏览器窗口关闭事件的监听方法集锦
Jun 24 Javascript
简单谈谈JS数组中的indexOf方法
Oct 13 Javascript
最细致的vue.js基础语法 值得收藏!
Nov 03 Javascript
jQuery实现的仿百度,仿谷歌搜索下拉框效果示例
Dec 30 Javascript
vue中使用cropperjs的方法
Mar 01 Javascript
JavaScript设计模式之命令模式实例分析
Jan 16 Javascript
Vue中插槽slot的使用方法与应用场景详析
Jun 08 Vue.js
Jquery 扩展方法
May 06 #Javascript
javascript 获取页面的高度及滚动条的位置的代码
May 06 #Javascript
屏蔽F1~F12的快捷键的js函数
May 06 #Javascript
MC Dialog js弹出层 完美兼容多浏览器(5.6更新)
May 06 #Javascript
picChange 图片切换特效的函数代码
May 06 #Javascript
JS 自定义函数缺省值的设置方法
May 05 #Javascript
JSQL 批量图片切换的实现代码
May 05 #Javascript
You might like
利用php+mysql来做一个功能强大的在线计算器
2010/10/12 PHP
基于php伪静态的实现详细介绍
2013/04/28 PHP
php解析json数据实例
2014/08/19 PHP
详解PHP的Laravel框架中Eloquent对象关系映射使用
2016/02/26 PHP
thinkphp3.x中session方法的用法分析
2016/05/20 PHP
session 加入redis的实现代码
2016/07/15 PHP
PHP实现的简单对称加密与解密方法实例小结
2017/08/28 PHP
ArrayList类(增强版)
2007/04/04 Javascript
HTML node相关的一些资料整理
2010/01/01 Javascript
IE的fireEvent方法概述及应用
2013/02/22 Javascript
js通过更改按钮的显示样式实现按钮的滑动效果
2014/04/23 Javascript
js中匿名函数的创建与调用方法分析
2014/12/19 Javascript
jQuery中DOM树操作之使用反向插入方法实例分析
2015/01/23 Javascript
js对字符的验证方法汇总
2015/02/04 Javascript
JS判断网页广告是否被浏览器拦截过滤的代码
2015/04/05 Javascript
JS实现的简易拖放效果示例
2016/12/29 Javascript
jquery代码规范让代码越来越好看
2017/02/03 Javascript
JS实现的简单四则运算计算器功能示例
2017/09/27 Javascript
微信小程序简单实现form表单获取输入数据功能示例
2017/11/30 Javascript
小程序hover-class点击态效果实现
2019/02/26 Javascript
Python面向对象进阶学习
2019/05/21 Python
python 的 scapy库,实现网卡收发包的例子
2019/07/23 Python
python爬虫豆瓣网的模拟登录实现
2019/08/21 Python
python GUI库图形界面开发之PyQt5动态加载QSS样式文件
2020/02/25 Python
Python如何使用bokeh包和geojson数据绘制地图
2020/03/21 Python
PyQt5+python3+pycharm开发环境配置教程
2020/03/24 Python
浅谈pytorch 模型 .pt, .pth, .pkl的区别及模型保存方式
2020/05/25 Python
Python使用Opencv实现边缘检测以及轮廓检测的实现
2020/12/31 Python
澳大利亚领先的折扣药房:Chemist Direct(有中文站)
2018/11/24 全球购物
Harrods英国:世界领先的奢侈品百货商店
2020/09/23 全球购物
社会实践心得体会
2014/01/03 职场文书
微电影大赛策划方案
2014/06/05 职场文书
田径运动会广播稿
2015/08/19 职场文书
基于JavaScript实现省市联动效果
2021/06/22 Javascript
Python 键盘事件详解
2021/11/11 Python
javascript中Set、Map、WeakSet、WeakMap区别
2022/12/24 Javascript