> web前端 > JavaScript > 正文 jQuery学习之开篇 2014-06-18 10:58:54 来源：jQuery学习之开篇 我要投稿 吐槽
最近比较烦,对于一个前端白痴来说,工作方向突然转向前端这块着实让人蛋疼无比。前段时间简单的学习了下EasyUI,算是对其有一个简单的认知了吧。EasyUI的研究过程中发现,如果没有掌握JS、JQuery想要进行后续的开发会非常困难。得,又得学下JQuery,一种蛋蛋的忧伤。一直认为前端的水非常的深这段时间算是见识到了,哎,不过工作还的继续,吐槽完了,卯足干劲充电吧!
前言某前端白痴一个,会点html+css+js.JQuery的学习书籍看的是《锋利的JQuery》,先入门看了两章,感觉能看懂,还不错。日后的学习也就打算采用该书了。当然参考网络上的一些博客文章(独立博客)也是十分必须的。
认识JQuery JavaScript认识JQuery之前,有必要了解下javascript。
一种脚本语言,使得网页和用户之间实现了一种实时的、动态的和交互的关系,网页中包含了更多的交互性的元素。其强大之处不用我这菜鸟再做赘述。不过其本身存在的一些弊端也就造成了后续js库的产生。主要的三大弊端:
基于javascript上述的缺点,为了简化js的开发一些javascript库诞生了。js库封装了很多预定义的对象和实用函数.能更加快速、便捷的建立页面交互元素。这里对于有哪些js库就不再多谈了，重点了解下JQuery,这也是自己后续学习的重点。
JQuery一个非常优秀的javascript库,对于js性能的理解也是十分的到位的。现如今在javasript渐渐隐去时(表喷我),JQuery也越发的受欢迎了。
JQuery凭借简洁的语法和跨平台的兼容性,极大地简化了js开发人员遍历HTML文档、操作DOM、处理事件、执行动画和开发Ajax的操作。其独特而又优雅的代码风格改变了javascript开发者设计思路和编写程序的方式。
JQuery的主旨就是"wirte less do more",写更少的代码，实现更多的功能。无论你是网页设计师、后台开发者、业余爱好者还是项目管理者,也无论是javascript初学者还是javascript高手,都有足够的理由去学习JQuery。
JQuery的优势jq强调的理念就是"wirte less,do more"。jq独特的选择器、链式的DOM操作、事件处理机制和封装完善的Ajax都是其他js库所不能达到的。概括来说jq的优势大致分为如下几个方面:
(1) 轻量级
jquery是非常轻巧的,采用Dean Edwards编写的Packer()压缩后,大小不到30kb。如果使用Min版本并且在服务器端启用Gzip压缩后,大小只有18kb。
(2) 强大的选择器
jqery允许开发者使用从css1到css3几乎所有的选择器,以及jquery独创的高级而且复杂的选择器。
(3) 出色的DOM操作的封装
jquery封装了大量常用的DOM操作,使开发者在编写DOM操作相关程序时候能够得心应手。jquery轻松的完成各种原本非常复杂的操作,使得js菜鸟也能写出出色的程序。
(4) 可靠的事件处理机制
jquery的事件处理机制吸收了javascript专家Dean Edwards编写的事件处理函数的精华,使得jquery在处理事件绑定的时候相当可靠。在预留退路、循序渐进以及非入侵编程思想方面,jquery也做的非常不错。
(5) 完善的Ajax
jquery将所有的Ajax操作封装到一个函数$.ajax()里,使得开发者处理ajax的时候能够专心的处理业务逻辑而无需关心浏览器兼容性和XMLHttpRequest对象的创建和使用的问题。
(6) 不污染顶级变量
jquery只是建立了一个名为jquery的对象,器所有的函数都是在这个对象之下的。其别名也可以随时交出控制权,不会污染其他变量,这使得jquery可以与js和其他js库共存,在项目中放心的引用而不需要考虑到后期可能的冲突。
(7) 出色的兼容性
作为一个流行的js库,jquery的浏览器兼容性也是十分良好的。
(8) 链式操作
对发生在同一个jq对象上的一组动作,可以直接连写而无需重复获取对象。这种链式操作方式使得jq的代码无比优雅。而且无需重复获取对象使得性能得到提升(选择器获取对象是比较消耗性能的)。
(9) 隐式迭代
当用jq找到带有".class"类的全部元素,隐藏它们时,无需编写循环遍历每一个返回的元素。jq里面的方法都是被设计成自动操作对象的集合,而不是单独的对象,这使得大量的玄幻结构变得不再必要,优化了代码量。
(10) 行为层与结构层的分离
开发者可以使用jqery选择器得到元素,然后直接给元素添加事件。这种将行为层与结构层完全分离的思想,使得jquery开发人员页面开发人员各司其职,避免了一些不必要的冲突,同时也便于后期的维护,不需要再html代码中寻找某些寒素和重复修改html代码。
(11) 丰富的插件支持
jquery是容易扩展的,这使得基于jquery的开源插件越来越懂,也越来越好,借助于一些开源的插件,能够快速的构建交互性较强的应用。
(12) 开源。
jquery是一个开源的产品,任何人都可以自由的使用并提出改进意见。开源使得一个产品更加具有活力,也会促进一个产品的不断改进,同时一些新的灵感和idea也将促进产品的深化。有理由相信开源的JQuery会越来越受欢迎。
简单的了解了下jquery接下来简单的尝试下jquery吧。
JQuery环境1、获取jquery
进入jquery官网:,下载最新的jquery库。
2、jquery库类型说明
在正式的编写代码之后,有必要了解下jquery库的两种类型:JQuery xxx.min.js(Minified and Gzipped) 和 JQuery xxx.js(Uncompressed)
前者是经过JSMin等工具进行压缩后的版本,大小为54kb,如果服务器开启Gzip压缩之后,大小将进一步减小为18kb。主要用户产品和项目。
后者是完整无压缩版本,主要用户测试、学习和开发。
3、JQuery环境配置
jquery无需安装,只需解压到相关文件夹中,开发的时候在html页面中引入该.js文件即可。
一个简单的例子:点击某个div实现隐藏该div,和原生js进行比较,代码如下:
JQuery学习入门 <script src="js/jquery-1.9.1.js"></script> 开关
点我隐藏
简单的了解了JQuery,也算对jquery有了一个认知吧,后续的就是一些知识点的积累了,OVER!
JSON详细学习之JSON in JavaScript
javascript学习之面向对象
javascript学习之DOM模型(一)
Extjs4学习之event和method的区别,以及
JavaScript学习之概述
Jsoup学习之Document类
Jquery重新学习之五[操作JSON数据]
Jquery重新学习之六[操作XML数据]
Jquery重新学习之七[Ajax运用总结A]
Jquery重新学习之八[Ajax运用总结B]
图文推荐
文章 推荐
相关文章
精彩导读
热门资讯
关注我们
