`
蜗牛慢慢爬
  • 浏览: 7178 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

WEB前端的jQuery程序语言

阅读更多
作为一个java商城开发以及jsp商城开发者来说js和jQuery是最长见也是最常用的,下面就来介绍jQuey常用的方法,首先$.fn.method() 语法来表示调用一组匹配元素的方法。比如当我说 $.fn.addClass,则表示$('div').addClass('blue') 或者 $('a.active').addClass('in-use') 此类的用法。$.fn 是 jQuery 包装元素的原型。
1. Sizzle 的权重:Sizzle 是 jQuery 用于在 DOM 找元素的的选择器引擎,基于 CSS 选择器。正是它将 $('div.active')转换成可操作的元素数组。我知道 Sizzle 占了 jQuery 相当大的部分,但它的庞大还是吓到了我。按行数来说它很无疑是 jQuery 中唯一最庞大的特性。我估计它占了总代码库的 22%,而第二大的特性—— $.ajax 只占了 8%。
2. $.grep:这个方法与 Underscore 的 _.filter 类似。接受两个参数,一个元素数组和一个函数,对每个元素依次执行函数,返回执行结果为 true 的元素数组。
3. 冒泡禁止:jQuery 明文禁止 load 事件冒泡。从内部看,jQuery 在所有的 load 事件中传入特殊的 noBubble: true标记,所以 image.load 事件才不会冒泡到 window 上错误地触发 window.load 事件。
4. 默认动画速度:jQuery 通过快速连续地改变样式属性来实现元素动画效果。每一次小改变被称作一个 tick。默认动画速度是每13毫秒运行一次 tick,要改变速度你可以重写 jQuery.fx.interval 成你想要的整数。
5. fn.addClass 可以接受函数:我们通常向 $.fn.addClass 提供一个包含类名的字符串来创建元素。但它也可以接受一个函数。这个函数必须返回一个字符串,多个类名间要以空格隔开。这里还有个彩蛋,这个函数接受已匹配元素的索引作为参数,你可以用这个特性来构造智能变化的类名。
6. fn.removeClass 也一样:与上文的一样,它也可以接受一个函数。这个函数也会自动接收元素的索引。
7. :empty 伪选择器:可以方便地用来匹配没有孩子的元素。
8. :lt 与 :gt 伪选择器:它们会根据元素在匹配集合中的索引来匹配元素。比如 $('div:gt(2)') 会返回所有的 div,除了前三个(从0开始)。如果你传入一个负数,它会倒过来从尾开始数。
9. $(document).ready() 的承诺: jQuery 貌似是用回了自己的东西。在内部,可信赖的 $(document).ready() 使用了一个 jQuery 延迟来确定 DOM 在什么时候完全加载。
10. $.type: 大家肯定能熟练使用 typeof 来确定数据类型,但你知不知道 jQuery 提供了一个 .type() 方法?jQuery 版比原生版更加智能。比如 typeof (new Number(3)) 返回 object,而 $.type(new Number(3)) 则返回 number。更新:正如 ShirtlessKirk 在评论中指出,$.type 返回其对象的 .valueOf() 属性。所以更准确的说法应该是 $.type 告诉你一个对象的返回值的类型。
11. $.fn.queue:你可以通过 $(‘div’).queue() 查看一个元素的效果队列,很方便地了解元素还剩余多少效果。更有用的是,你可以直接操作队列去添加效果。从 jQuery 文档摘录的:
12. 禁用元素不会触发 click 事件:jQuery 默认不会为禁用的元素执行 click 事件,有了这个优化,你无需自己用代码再检查一遍。
13. $.fn.on 可以接受对象:你知道 $.fn.on 可以接受一个对象来一次过连接多个事件吗?jQuery 文档的
14. $.camelCase:这个有用的方法可以将连字符式的字符串转换成驼峰式的字符串。
15. $.active:调用 $.active 返回 XHR (XML Http Request) 查询的个数。利用它可以手动制定 AJAX 请求的并发上限。
16. $.fn.parentsUntil / $.fn.nextUntil / $.fn.prevUntil:我比较熟悉 .parents()、.next() 和 .prev(),却不知道原来还有其它的方法。它们会匹配所有的 双亲/下一个/前一个 元素直到(until)遇到符合终止条件的元素。
17. $.fn.clone 参数:当你用 .clone() 克隆一个元素,你可以用 true 作为第一个参数来克隆该元素的数据属性(data attributes)和事件。
18. 更多的 $.fn.clone 参数:除了上面的方法外,你还可以再传多一个 true 参数来克隆该元素所有孩子的数据属性和事件。这叫做“深克隆”。第二个参数的默认值与第一个一样(第一个默认false)。所以当第一个参数是 true 而你想让第二个参数也是 true 时,完全可以忽略第二个参数。



分享到:
评论

相关推荐

    JavaScript jQuery交互式Web前端开发

    JavaScript是一种广泛使用的编程语言,尤其在Web前端开发中扮演着核心角色。它是一种解释型或即时编译型的脚本语言,被设计用来增加网页的互动性,使之能够响应用户的操作。JavaScript的主要特点包括: 1. **轻量级...

    JavaScript+jQuery交互式Web前端开发-源代码.zip

    JavaScript 和 jQuery 是现代 Web 前端开发中的两个核心工具,它们共同为创建动态、交互式的网页提供了强大的功能。在本教程中,我们将深入探讨如何将这两种技术与 HTML 和 CSS 结合,以实现高效的网页设计。 ...

    web前端课程设计以及报告,jquery+js+css+html

    在本项目中,"web前端课程设计以及报告,jquery+js+css+html" 主要关注的是使用Web前端技术来构建交互式用户界面。这个课程设计涵盖了四个关键的技术:jQuery、JavaScript、CSS和HTML,这些都是现代Web开发的基础。 ...

    Web前端技术(期末复习 选填、判断、简答、编程等超全总结).zip

    这份名为"Web前端技术(期末复习 选填、判断、简答、编程等超全总结).zip"的压缩包文件包含了全面的Web前端学习资源,适合期末复习和备考。以下是基于该压缩包文件可能包含的知识点的详细说明: 1. HTML...

    web前端课程设计.zip

    Web前端是构建互联网应用程序和网站的关键部分,它涉及到用户与网站互动的所有视觉和交互元素。本压缩包"web前端课程设计.zip"包含了实现这一目标所需的学习资源,让我们一一解析其中包含的知识点。 首先,Web前端...

    web前端页面实例

    Web前端页面实例是开发者在学习和实践中积累的重要资源,它涵盖了JavaScript、jQuery和CSS这三种核心技术的运用。这些技术是构建交互式、动态且视觉吸引力强的网页的关键工具。 JavaScript,作为网页的脚本语言,...

    web前端期末大作业源码.zip

    【标题】"Web前端期末大作业源码.zip"是一个包含前端开发项目的压缩文件,这个项目很可能是学生在学期末完成的一项课程任务。它涉及到的主要技术包括HTML、CSS和JavaScript,这些都是构建网页和交互式用户体验的核心...

    web前端开发教材初级源代码.rar

    JavaScript是一种动态编程语言,用于实现网页的交互性和动态功能。基础概念包括变量、数据类型、操作符、流程控制(条件语句、循环)。JavaScript可以操作DOM(Document Object Model),改变HTML内容和样式。事件...

    WEB前端项目开发实践

    3. JavaScript:JavaScript是一种动态编程语言,用于实现网页的交互性和动态功能。基础语法、DOM操作、事件处理、AJAX异步请求等都是JavaScript的关键知识点。 4. 响应式设计:随着多设备浏览的需求,响应式设计...

    jQuery的基础教程文档 web开发 前端

    jQuery能够改变开发者编写JavaScript脚本的方式,简化Web前端开发过程,提高开发效率。无论对于初学者还是资深专家,jQuery都是Web开发中不可或缺的工具。它适用于设计师、开发者、Web编程爱好者以及商业开发项目,...

    微信企业号JAVA源码+前端jquery mobile

    标题 "微信企业号JAVA源码+前端jquery mobile" 涉及到的主要知识点包括微信企业号的开发、JAVA编程语言的应用以及前端开发技术——jQuery Mobile。以下是对这些知识点的详细说明: 1. 微信企业号开发:微信企业号是...

    移动互联Web前端项目3_using566_web前端_

    Web前端是构建互联网应用程序的重要组成部分,它负责用户与应用之间的交互,特别是在移动设备上,良好的前端设计能够提供优秀的用户体验。 "using566"可能指的是使用特定的技术栈或工具集,比如"566"可能是一个简化...

    java web 前端开发技术调查问卷.docx

    * Q3 中关于 jQuery 语言掌握水平的选择,反映了前端开发者对 jQuery 语言的掌握水平。 * jQuery 是一种流行的 JavaScript 库,用于简化 JavaScript 编程和提高开发效率。 * jQuery 语言掌握水平的选择包括:听说过...

    2015最新da内WEB前端培训视频

    视频教程是学习编程语言和技术的理想方式,因为它提供了直观的视觉演示和讲解,使学习过程更为生动和易于理解。 【标签】"web前端"、"前端"、"教程" 这些标签明确了这个培训内容的主题,Web前端是互联网应用开发的...

    web前端人形时钟

    3. Flash动画制作:了解ActionScript(Flash的编程语言),创建和控制Flash对象,实现动画效果。 4. CSS样式:用CSS来美化时钟的外观,包括颜色、布局和过渡效果。 5. 响应式设计:确保时钟在不同设备和屏幕尺寸上都...

    web前端日历程序

    在web前端开发中,日历程序是一个常见的交互元素,它被广泛用于各种应用程序,如事件管理、日期选择器、计划安排等。一个优秀的web前端日历程序应当具有良好的用户体验、可自定义性以及兼容多种浏览器。下面将详细...

    Web前端学习线路图及资源

    这份"Web前端学习线路图及资源"旨在为初学者提供一个全面的学习路径,涵盖了一系列关键的技术栈,如HTML5(H5)、CSS3、JavaScript、jQuery、Vue.js、React.js、Node.js以及Git。下面将逐一解析这些技术及其重要性。...

    web前端开发帮助文档大合集

    本合集“web前端开发帮助文档大合集”是针对这一领域的一份全面资源,涵盖了前端开发中的关键技术和工具,如jQuery、CSS、HTML、JavaScript以及XML等。 首先,HTML(HyperText Markup Language)是网页的基础,它...

    web前端开发技术综述思维导图

    Web前端开发技术是构建互联网应用的关键部分,它专注于用户与应用程序的交互,为用户提供直观、易用的界面。本文将对这一领域的核心概念和技术进行详细阐述。 首先,Web概述涉及了Web前端的主要任务,即信息内容的...

    第1章 Web前端开发基础.pdf

    在本章《Web前端开发基础》中,我们将深入探讨构建现代网页和应用程序所需的基本技能、技术和工具。Web前端开发是互联网行业中至关重要的一个领域,它专注于用户与网站交互的界面和体验。 首先,我们来看看实训的...

Global site tag (gtag.js) - Google Analytics