jQuery - Chaining

@(编程)

通过 jQuery,您可以把动作/方法链接起来。

Chaining 允许我们在一条语句中允许多个 jQuery 方法(在相同的元素上)。

jQuery 方法链接

直到现在,我们都是一次写一条 jQuery 语句(一条接着另一条)。

不过,有一种名为链接(chaining)的技术,允许我们在相同的元素上运行多条 jQuery 命令,一条接着另一条。

提示:这样的话,浏览器就不必多次查找相同的元素。

如需链接一个动作,您只需简单地把该动作追加到之前的动作上。

例子 1

下面的例子把 css(), slideUp(), and slideDown() 链接在一起。"p1" 元素首先会变为红色,然后向上滑动,然后向下滑动

$("#p1").css("color","red").slideUp(2000).slideDown(2000);

如果需要,我们也可以添加多个方法调用。

提示:当进行链接时,代码行会变得很差。不过,jQuery 在语法上不是很严格;您可以按照希望的格式来写,包含折行和缩进。

例子 2

这样写也可以运行

$("#p1").css("color","red")
.slideUp(2000)
.slideDown(2000);

jQuery 会抛掉多余的空格,并按照一行长代码来执行上面的代码行。

jQuery - Chaining的更多相关文章

  1. jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

    一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...

  2. JQuery: JQuery效果(隐藏、显示、切换,滑动,淡入淡出,以及动画)

    JQuery:效果 JQuery效果有很多,包括隐藏.显示.切换,滑动,淡入淡出,以及动画等.隐藏:JQuery hide() 显示:JQuery show() 切换:JQuery toggle() ...

  3. jQuery基础知识--选择器与效果

    $(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class ...

  4. python 爬取w3shcool的JQuery的课程并且保存到本地

    最近在忙于找工作,闲暇之余,也找点爬虫项目练练手,写写代码,知道自己是个菜鸟,但是要多加练习,书山有路勤为径.各位爷有测试坑可以给我介绍个啊,自动化,功能,接口都可以做. 首先呢,我们明确需求,很多同 ...

  5. Code optimization and organization in Javascript / jQuery

    This article is a combined effort of Innofied Javascript developers Puja Deora and Subhajit Ghosh) W ...

  6. 应该掌握的JQuery的7个效果

    一: 语法: $(selector).hide(speed,callback); $(selector).show(speed,callback); 实例 //点击隐藏 $("#hide&q ...

  7. [转]jQuery 双击事件(dblclick)时,不触发单击事件(click)

    例1: 链接:http://www.w3school.com.cn/jquery/event_dblclick.asp HTML 系列教程 浏览器脚本 服务器脚本 ASP.NET 教程 XML 系列教 ...

  8. 【JQuery】(1)JQuery基础

    JQuery基础 2019-11-02  21:11:17  by冲冲 1.jQuery简介 jQuery:轻量级."写的少,做的多".JavaScript函数库. 2.jQuer ...

  9. ASP。NET MVC警告横幅使用Bootstrap和AngularUI Bootstrap

    Watch this script in action - demo 下载Source Code from GitHub 下载Source Code from CodeProject (1.1 MB) ...

随机推荐

  1. 为Gradle添加tomcat插件,调试WEB应用

    Gradle提供了不输于maven的依赖管理 提供了强大的test功能,输出优美的测试报告 并且提供war插件,使用内置的jetty调试WEB应用 因为博主偏偏钟情于tomcat,所以希望使用tomc ...

  2. AWS 之Load Balance篇

    public class CreateELB { /// <summary> /// 连接AWS服务器 /// </summary> /// <param name=&q ...

  3. quartz的触发器CronTriggerBean 配置

    一个Quartz的CronTrigger表达式分为七项子表达式,其中每一项以空格隔开,从左到右分别是:秒,分,时,月的某天,月,星期的某天,年:其中年不是必须的,也就是说任何一个表达式最少需要六项!  ...

  4. 【转】发布的QT程序无法显示图标和图片的问题

    在windows下编译好的QT程序在其他没有安装QT的机器上会出现图标和图片无法正常显示的问题. 这时我们可以通过以下方式来解决: 在release文件夹里创建plugins文件夹,并将QT安装目录下 ...

  5. gridview自定义表头

    gridview为我们提供了丰富的接口,用于满足自定义需求. 通常asp:gridview会根据绑定的列Columns自动生成表头,展现在前台元素. 序号 类别 有时候需要复杂一些的表头. 序号 类别 ...

  6. 一起学CUDA(零)

    1.Nvidia为什么引入CUDA最近实验室已经有不少豪在入手本本了,因为学霸居多,所以大家一般都会说对显卡要求不高,不玩大型游戏,只是CPU不能差,Intel I7.3G的主频…… 其 实现在CPU ...

  7. HDU 4750

    解题方法,,,首先应该可以看出来是一颗 最小生成树,任意一条的边的价值是不同的:所以计算出最小生成树的每一条边有多少对顶点满足他的 f 值就是这条边的 权值,因此可以在生成最小生成树的时候,进行一下统 ...

  8. Heritrix源码分析(二) 配置文件order.xml介绍(转)

    本博客属原创文章,欢迎转载!转载请务必注明出处:http://guoyunsky.iteye.com/blog/613412      本博客已迁移到本人独立博客: http://www.yun5u. ...

  9. 【转】session setup failed: NT_STATUS_LOGON_FAILURE -- 不错

    原文网址:http://blog.sina.com.cn/s/blog_5cdb72780100l26f.html samba服务器出现“session setup failed: NT_STATUS ...

  10. WCF tcpTrace.exe配置

    Web.config <?xml version="1.0" encoding="utf-8"?> <configuration> &l ...