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 相关文章推荐
判断及设置浏览器全屏模式
Apr 20 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
Aug 26 Javascript
跟我学习javascript的var预解析与函数声明提升
Nov 16 Javascript
微信小程序 Storage API实例详解
Oct 02 Javascript
关于Sequelize连接查询时inlude中model和association的区别详解
Feb 27 Javascript
node.js实现回调的方法示例
Mar 01 Javascript
JavaScrpt中如何使用 cookie 设置查看与删除功能
Jul 09 Javascript
简单实现js上传文件功能
Aug 21 Javascript
JS中‘hello’与new String(‘hello’)引出的问题详解
Aug 14 Javascript
通过实例了解JS 连续赋值
Sep 24 Javascript
vue项目中使用bpmn-自定义platter的示例代码
May 11 Javascript
vue实现评价星星功能
Jun 30 Javascript
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生成网页快照 不用COM不用扩展.
2010/02/11 PHP
PHP中数组的三种排序方法分享
2012/05/07 PHP
PHP实现随机生成水印图片功能
2017/03/22 PHP
PHP开启目录引索+fancyindex漂亮目录浏览带搜索功能
2019/09/23 PHP
PHP队列场景以及实现代码实例详解
2021/02/26 PHP
IE8 引入跨站数据获取功能说明
2008/07/22 Javascript
Jquery Ajax请求代码(2)
2011/01/07 Javascript
JavaScript中实现最高效的数组乱序方法
2014/10/11 Javascript
微信小程序 for 循环详解
2016/10/09 Javascript
Vue.js系列之项目搭建(1)
2017/01/03 Javascript
使用jQuery实现一个类似GridView的编辑,更新,取消和删除的功能
2017/03/15 Javascript
JavaScript的六种继承方式(推荐)
2017/06/26 Javascript
微信小程序 数据绑定及运算的简单实例
2017/09/20 Javascript
为输入框加入数字js校验代码分享
2017/11/02 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
2017/11/14 jQuery
react学习笔记之state以及setState的使用
2017/12/07 Javascript
原生JS实现多个小球碰撞反弹效果示例
2018/01/31 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
2019/09/20 Javascript
小程序跳转到的H5页面再跳转回跳小程序的方法
2020/03/06 Javascript
python文件操作之目录遍历实例分析
2015/05/20 Python
python列出目录下指定文件与子目录的方法
2015/07/03 Python
Python正则表达式教程之三:贪婪/非贪婪特性
2017/03/02 Python
numpy数组之存取文件的实现示例
2019/05/24 Python
Python 模拟生成动态产生验证码图片的方法
2020/02/01 Python
为什么说python更适合树莓派编程
2020/07/20 Python
Python+kivy BoxLayout布局示例代码详解
2020/12/28 Python
HTML5之SVG 2D入门1—SVG(可缩放矢量图形)概述
2013/01/30 HTML / CSS
美国最大的香水连锁店官网:Perfumania
2016/08/15 全球购物
新加坡航空官方网站:Singapore Airlines
2016/10/13 全球购物
Sunglasses Shop英国:欧洲领先的太阳镜在线供应商之一
2018/09/19 全球购物
鼓励运动员的广播稿
2014/02/08 职场文书
《故都的秋》教学反思
2014/04/15 职场文书
留学生求职信
2014/06/03 职场文书
Python 详解通过Scrapy框架实现爬取CSDN全站热榜标题热词流程
2021/11/11 Python
JavaScript ES6的函数拓展
2022/01/18 Javascript
SpringBoot项目多数据源及mybatis 驼峰失效的问题解决方法
2022/07/07 Java/Android