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 相关文章推荐
ajax 同步请求和异步请求的差异分析
Jul 04 Javascript
JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)
Oct 17 Javascript
JavaScript知识点总结之如何提高性能
Jan 15 Javascript
利用Angularjs中模块ui-route管理状态的方法
Dec 27 Javascript
Angular 2 利用Router事件和Title实现动态页面标题的方法
Aug 23 Javascript
ES6学习教程之块级作用域详解
Oct 09 Javascript
深入理解js 中async 函数的含义和用法
May 13 Javascript
vue打包的时候自动将px转成rem的操作方法
Jun 20 Javascript
微信小程序实现下拉菜单切换效果
Mar 30 Javascript
详解小程序如何避免多次点击,重复触发事件
Apr 08 Javascript
基于mpvue的简单弹窗组件mptoast使用详解
Aug 02 Javascript
JS对日期操作封装代码实例
Nov 08 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修正代码
2011/05/09 PHP
Array of country list in PHP with Zend Framework
2011/10/17 PHP
PHP错误和异长常处理总结
2014/03/06 PHP
PHP图片裁剪函数(保持图像不变形)
2014/05/04 PHP
PHP反射机制用法实例
2014/08/28 PHP
php使用GD创建保持宽高比缩略图的方法
2015/04/17 PHP
PHP中类属性与类静态变量的访问方法示例
2016/07/13 PHP
PHP代码加密的方法总结
2020/03/13 PHP
JQuery textlimit 显示用户输入的字符数 限制用户输入的字符数
2009/05/14 Javascript
Jquery 基础学习笔记
2009/05/29 Javascript
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
jquery导航制件jquery鼠标经过变色效果示例
2013/12/05 Javascript
js生成随机数之random函数随机示例
2013/12/20 Javascript
JavaScript中利用构造器函数模拟类的方法
2017/02/16 Javascript
ajax接收后台数据在html页面显示
2017/02/19 Javascript
Vue.js实现移动端短信验证码功能
2017/03/29 Javascript
Vue-cli3简单使用(图文步骤)
2019/04/30 Javascript
Vue数据驱动表单渲染,轻松搞定form表单
2019/07/19 Javascript
[00:43]FTP典藏礼包 DOTA2三大英雄霸气新套装
2014/03/21 DOTA
Python中的MongoDB基本操作:连接、查询实例
2015/02/13 Python
浅谈Python的list中的选取范围
2018/11/12 Python
基于Python的微信机器人开发 微信登录和获取好友列表实现解析
2019/08/21 Python
解决Django中修改js css文件但浏览器无法及时与之改变的问题
2019/08/31 Python
用python按照图像灰度值统计并筛选图片的操作(PIL,shutil,os)
2020/06/04 Python
Joules官网:女士、男士和儿童服装和鞋类
2018/10/23 全球购物
中东奢侈品市场:Coveti
2019/05/12 全球购物
西班牙宠物用品和食品网上商店:Tiendanimal
2019/06/06 全球购物
美国宠物护理专家:Revival Animal Health
2020/01/05 全球购物
周年庆典主持词
2014/04/02 职场文书
小学五年级学生评语
2014/04/22 职场文书
2014年维修电工工作总结
2014/11/20 职场文书
小学一年级学生评语大全
2014/12/25 职场文书
《用字母表示数》教学反思
2016/02/17 职场文书
解决Python中的modf()函数取小数部分不准确问题
2021/05/28 Python
Win11 25163.1010更新补丁KB5016904推送,测试服务验证管道(附更新修复汇总)
2022/07/23 数码科技