jQuery技术

jquery学习大总结.doc

字号+ 作者:H5之家 来源:H5之家 2017-06-04 11:00 我要评论( )

jquery 学习大总结篇一: jQuery 学习总结 jQuery 学习总结因为项目需要,同时也因为兴趣,在近一段时间研究和使用了 jQuery ,它真的是太强大了,代码非常的优雅和简

文档介绍:
jquery 学习大总结篇一: jQuery 学习总结 jQuery 学习总结因为项目需要,同时也因为兴趣,在近一段时间研究和使用了 jQuery ,它真的是太强大了,代码非常的优雅和简洁,好后悔现在才开始了解它, 虽然目前网络上关于 jQuery 的资料、学习心得, 教程多得你看不完,但我还是想把自己的一点学习经验写下来, 不管是提供给那些想学习 jQuery 的人,还是保留一份学习笔记, 我觉得这都是很有必要的。在说 jQuer y 之前, 不得不提下现在也非常流行的 mootool s 框架。在网上, 很多人把 mootools 比作 java ,把 jquery 比作 perl 。我没研究过 mootools ,也不发表意见,这完全没有意义。只要本身不存在重大缺陷就可以了。用好了都强大。好比 Java 和.NET 争论了这么多年,一样的道理。 jQuery ,顾名思义,也就是 JavaScript 和查询( Query ) ,即是辅助开发的库。是继 prototype 之后又一个优秀的 JavaScript 框架。它如暴风雪般席卷 WEB 前端开发, jQuery 已确定成为 MVC 和 Visual Studio 2008 版本中的正式组成部分, 诺基亚手机平台 Web Run-Time 也将纳入 jQuery 。所以,请相信,选择 jQuer y 是不会错的。如果你看到这里还有犹豫,那么我再说个理由,应该能打消你的最后疑虑了。 2009 年 12 月份 Tiobe 编程语言排行榜 JavaScript 升到第 8 名,并且在上升势头最强劲的语言中排名第 3 位。我在这里不是想说排行榜的话题,因为那又会引发一场说不完的争论。我的意思是,排行榜不能说明一切问题,但至少能够说明,现在用哪种语言的人多,人多则说明有活力,相应的其它各种资源也会较丰富。 JavaScript 脚本已经深入 WEB 应用之中。而作为优秀的 JavaScript 框架, 它的前景不用怀疑。除非出现一个比 jQuery 更牛 B ,更优秀的东东。我不打算像写教程那样,把 jQuery 的基础用法都罗列出来,那会很无趣,也没意义。网上这方面的知识随便搜一下就一大堆。我准备从项目的角度出发,写出自己的感受。当然,一份 API 帮助文档是必不可少的,在最末尾提供了 jQuery-1.2.6.chm 下载,需者自取。首先我们要知道, JavaScript 开发基本可以分为以下四个部分: 1 、查找 DOM 元素进行取值和赋值的操作、在特定节点位置进行内容的取值和赋值操作( innerHTML )。 2 、针对元素进行事件监听。 3 、通过操作 DOM 节点结合改变元素的 CSS 样式,达到绚丽的动画效果。 4 、对 DOM 元素进行 Ajax 操作。对于 jQuery 来说,可以对这四部分提供完美的实现: a、 jQuery 拥有强大的选择器,可以查找任意的 DOM 元素。同时 jQuer y 对象实现链式语法, 能够很方便简洁的写出强大的操作。比如操作属性: $(#chkbox).attr(checked,checked).attr(disabled,disabled) 。可以这样继续链下去,包括增加事件、样式等等操作。 b 、在页面加载时给 DOM 绑定事件。$(#chkbox).click(function(){ alert(hello jquery!); });c 、 show() 和 hide() 是 jQuery 中最基本的动画。对元素显示和隐藏, 当然, 我们还可以实现其它的更复杂的动画。 d、$.ajax(options) 是 jQuery 中最底层的 Ajax 实现。除此之外, 还可以使用$.get() 或$.post() 实现 Ajax 请求。了解了以上内容后, jQuery 带给我们的另一个惊喜,在于它的 API 支持当前多种主流浏览器,使得你不用再为了 IE、 FireFox 等兼容问题而抓头发伤脑筋。在以前做项目的时候,我总是喜欢将行为或样式属性写在 DOM 中。这是极其不好也极其不规范的一种做法。如今采用 jQuery 后,我将所有的行为全部从 DOM 中抽取了出来, 放到 jQuery 初始化函数中进行绑定。而且 jQuery 的初始化函数比 window.onload 的加载速度更快。$(function(){ $(#chkbox).click( function(){ alert(hello jQuery!); } ); }); input type=checkbox id=chkbox/ 上面是一种简写方法,不管是初始化函数还是绑定事件。推荐采用这种写法。※下面这种写法是不可取的,行为一定要和 DOM 分离: function chkClick(){ alert(hello jQuery); } input type=checkbox id=chkbox onclick=chkClick()/ ※不要再把样式写到 DOM 里面,这是很难维护的一件事情: span style=font-size:15pt;color:redhello jQuery/span 应该统一采用 CSS 文件定义或是定义 class 类,或是对 ID 进行定义: .spanClass{ font-size:15pt; color:red; } span class=spanClasshello jQuery/span #hello_span{ font-size:15pt; color:red; } span id=hello_spanhello jQuery/span 在上一篇 jQuery 学习总结(一)中, 简单的介绍了 jQuery 提供对 JavaScript 开发的四个部分的支持, 这篇文章将详细的用代码示例来说明如何实现。 1、 DOM jQuery 提供强大的 DOM 查找功能, 并且能够很方便的进行取值和赋值操作。查找元素最主要的是使用选择器,可能还会需要筛选器的配合。从项目中来看,给 DOM 元素设置 id及 name , 会比较容易实现需求。我列一下使用得最多的几种选择器: #id 、.class 、 element 、:eq 、[attribute – value] 、[attribute$=value] 、[attribute=value] 、[attribute] 、:checked 、:selected 等等。另外 jQuery 提供的属性也是强大利器: attr 、 removeAttr 、 addClass 、 removeClass 、 html 、 val 等, 在实际中, 大量的被应用。在文档处理及 CSS 中 append 、 clone 、 empty 、 css 、 height 、 width 也是使用频率很高的。关于这部分的知识很复杂,精髓我可写不出来,我只能把我在项目中的体会、感悟、想法记录下来,给需要的人一点帮助就很开心了

12>

内容来自淘豆网转载请标明出处.

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 推荐5款实用的jQuery时间轴插件

    推荐5款实用的jQuery时间轴插件

    2017-06-08 11:00

  • jQuery v3.1.1

    jQuery v3.1.1

    2017-06-02 18:00

  • jQuery前端开发35个小技巧

    jQuery前端开发35个小技巧

    2017-06-01 18:02

  • jquery实现图片左右切换的方法

    jquery实现图片左右切换的方法

    2017-06-01 18:00

网友点评