jQuery 开天辟地入门篇一


Posted in Javascript onDecember 09, 2009

一.摘要
二.前言
三.什么是jQuery
jQuery是一套Javascript脚本库. 在我的博客中可以找到"Javascript轻量级脚本库"系列文章. Javascript脚本库类似于.NET的类库, 我们将一些工具方法或对象方法封装在类库中, 方便用户使用.

注意jQuery是脚本库, 而不是脚本框架. "库"不等于"框架", 比如"System程序集"是类库,而"ASP.NET MVC"是框架. jQuery并不能帮助我们解决脚本的引用管理和功能管理,这些都是脚本框架要做的事.

脚本库能够帮助我们完成编码逻辑,实现业务功能. 使用jQuery将极大的提高编写javascript代码的效率, 让写出来的代码更加优雅, 更加健壮. 同时网络上丰富的jQuery插件也让我们的工作变成了"有了jQuery,天天喝茶水"--因为我们已经站在巨人的肩膀上了.

创建一个ASP.NET MVC项目时, 会发现已经自动引入了jQuery类库. jQuery几乎是微软的御用脚本库了!完美的集成度和智能感知的支持,让.NET和jQuery天衣无缝结合在一起!所以用.NET就要选用jQuery而非Dojo,ExtJS等.

jQuery有如下特点:

1.提供了强大的功能函数使用这些功能函数, 能够帮助我们快速完成各种功能, 而且会让我们的代码异常简洁.

2.解决浏览器兼容性问题javascript脚本在不同浏览器的兼容性一直是Web开发人员的噩梦, 常常一个页面在IE7,Firefox下运行正常, 在IE6下就出现莫名其妙的问题. 针对不同的浏览器编写不同的脚本是一件痛苦的事情. 有了jQuery我们将从这个噩梦中醒来, 比如在jQuery中的Event事件对象已经被格式化成所有浏览器通用的, 从前要根据event获取事件触发者, 在ie下是event.srcElements 而ff等标准浏览器下下是event.target. jQuery则通过统一event对象,让我们可以在所有浏览器中使用event.target获取事件对象.

3.实现丰富的UIjQuery可以实现比如渐变弹出, 图层移动等动画效果, 让我们获得更好的用户体验. 单以渐变效果为例, 从前我自己写了一个可以兼容ie和ff的渐变动画, 使用大量javascript代码实现, 费心费力不说, 写完后没有太多帮助过一段时间就忘记了. 再开发类似的功能还要再次费心费力. 如今使用jQuery就可以帮助我们快速完成此类应用.

4.纠正错误的脚本知识这一条是我提出的, 原因就是大部分开发人员对于javascript存在错误的认识. 比如在页面中编写加载时即执行的操作DOM的语句, 在HTML元素或者document对象上直接添加"onclick"属性, 不知道onclick其实是一个匿名函数等等. 拥有这些错误脚本知识的技术人员也能完成所有的开发工作, 但是这样的程序是不健壮的. 比如"在页面中编写加载时即执行的操作DOM的语句", 当页面代码很小用户加载很快时没有问题, 当页面加载稍慢时就会出现浏览器"终止操作"的错误.jQuery提供了很多简便的方法帮助我们解决这些问题, 一旦使用jQuery你就将纠正这些错误的知识--因为我们都是用标准的正确的jQuery脚本编写方法!

5.太多了! 等待我们一一去发现. 四.Hello World jQuery
按照惯例, 我们来编写jQuery的Hello World程序, 来迈出使用jQuery的第一步.

在本文最后可以下本章的完整源代码.
1.下载jQuery类库

jQuery的项目下载放在了Google Code上, 下载地址:

Javascript 相关文章推荐
基于JQuery实现相同内容合并单元格的代码
Jan 12 Javascript
基于jquery的横向滚动条(滑动条)
Feb 24 Javascript
node.js 使用ejs模板引擎时后缀换成.html
Apr 22 Javascript
js 获取元素所有兄弟节点的实现方法
Sep 06 Javascript
js基于myFocus实现轮播图效果
Feb 14 Javascript
整理关于Bootstrap排版的慕课笔记
Mar 29 Javascript
利用C/C++编写node.js原生模块的方法教程
Jul 07 Javascript
Bootstrap 模态框多次显示后台提交多次BUG的解决方法
Dec 26 Javascript
使用classList来实现两个按钮样式的切换方法
Jan 24 Javascript
Async/Await替代Promise的6个理由
Jun 15 Javascript
vue使用websocket的方法实例分析
Jun 22 Javascript
vue浏览器返回监听的具体步骤
Feb 03 Vue.js
jquery tablesorter.js 支持中文表格排序改进
Dec 09 #Javascript
jquery 事件执行检测代码
Dec 09 #Javascript
为指定元素增加样式的js代码
Dec 09 #Javascript
javascript setTimeout和setInterval 的区别
Dec 08 #Javascript
javascript OFFICE控件测试代码
Dec 08 #Javascript
JavaScript Cookie 直接浏览网站分网址
Dec 08 #Javascript
JavaScript Cookie显示用户上次访问的时间和次数
Dec 08 #Javascript
You might like
PHP5 的对象赋值机制介绍
2011/08/02 PHP
Server.HTMLEncode让代码在页面里显示为源代码
2013/12/08 PHP
php stripslashes和addslashes的区别
2014/02/03 PHP
php实现把url转换迅雷thunder资源下载地址的方法
2014/11/07 PHP
thinkPHP中_initialize方法实例分析
2016/12/05 PHP
alixixi runcode.asp的代码不错的应用
2007/08/08 Javascript
JavaScript Undefined,Null类型和NaN值区别
2008/10/22 Javascript
jQuery第三课 修改元素属性及内容的代码
2010/03/14 Javascript
可以将word转成html的js代码
2010/04/11 Javascript
js加载之使用DOM方法动态加载Javascript文件
2013/11/08 Javascript
js中的eventType事件及其浏览器支持性介绍
2013/11/29 Javascript
javaScript 计算两个日期的天数相差(示例代码)
2013/12/27 Javascript
JavaScript中的正则表达式简明总结
2014/04/04 Javascript
JavaScript实现的GBK、UTF8字符串实际长度计算函数
2014/08/27 Javascript
jQuery焦点图插件SaySlide
2015/12/21 Javascript
jQuery实现滚动鼠标放大缩小图片的方法(附demo源码下载)
2016/03/05 Javascript
jquery获取链接地址和跳转详解(推荐)
2017/08/15 jQuery
jQuery进阶实践之利用最优雅的方式如何写ajax请求
2017/12/20 jQuery
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
详解关于element el-button使用$attrs的一个注意要点
2018/11/09 Javascript
利用d3.js力导布局绘制资源拓扑图实例教程
2019/01/08 Javascript
深入了解JavaScript 的 WebAssembly
2019/06/15 Javascript
jquery获取并修改触发事件的DOM元素示例【基于target 属性】
2019/10/10 jQuery
jQuery实现的移动端图片缩放功能组件示例
2020/05/01 jQuery
vue实现简易图片左右旋转,上一张,下一张组件案例
2020/07/31 Javascript
[02:38]DOTA2亚洲邀请赛 IG战队巡礼
2015/02/03 DOTA
Face++ API实现手势识别系统设计
2018/11/21 Python
TensorFlow基于MNIST数据集实现车牌识别(初步演示版)
2019/08/05 Python
OpenCV里的imshow()和Matplotlib.pyplot的imshow()的实现
2019/11/25 Python
Python实现汇率转换操作
2020/05/03 Python
html5中localStorage本地存储的简单使用
2017/06/16 HTML / CSS
团支书竞选演讲稿
2014/04/28 职场文书
理想国读书笔记
2015/06/25 职场文书
Nginx 根据URL带的参数转发的实现
2021/04/01 Servers
关于vue中如何监听数组变化
2021/04/28 Vue.js
python实现语音常用度量方法的代码详解
2021/05/25 Python