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. 51nod1586 约数和

    果然我自己写的读入优化naive!...换题目给的读入优化就A了...话说用visual交快了好多啊... const int BufferSize=1<<16; char buffer[ ...

  2. GUI for git|SourceTree|入门基础

    原文链接:http://www.jianshu.com/p/be9f0484af9d 目录 SourceTree简介 SourceTree基本使用 SourceTree&Git部分名词解释 相 ...

  3. XenServer6.2详细安装步骤

    系统要求 系统要求 XenServer 至少需要两台单独的 x86 物理计算机:一台用作 XenServer 主机,另一台用于运行XenCenter 应用程序. XenServer 主计算机完全专用于 ...

  4. MVC+Ef项目(1) 项目的框架搭建

    一:首先我们来搭建最基本的项目框架,这里使用MVC3作为web项目,然后我们添加几个类库项目 最后的项目如下, 其中有一个 YouJiao.MvcWeb.Repository 实际就当做是 DAL层即 ...

  5. Hide/Show running Console

    http://stackoverflow.com/questions/3571627/show-hide-the-console-window-of-a-c-sharp-console-applica ...

  6. notebook kernels

    http://10.139.97.132/user/8e6ef01ea71d3f988e61bf2db17c3031/api/kernels [{"id": "f0987 ...

  7. 20160125.CCPP详解体系(0004天)

    程序片段(01):宽字符.c 内容概要:宽字符 #include <stdio.h> #include <stdlib.h> #include <Windows.h> ...

  8. == Rickard Oberg & TheServerSide

    看了Hani Suleiman和Rickard Oberg ,发现其实每个所谓的权威都应该有被质疑的绝对,可能往往权威会令人觉得理所应当

  9. 查看mysql库大小,表大小,索引大小

    查看所有库的大小 mysql> use information_schema; Database changed mysql> selectconcat(round(sum(DATA_LE ...

  10. makefile实例(3)-多个文件实例优化

    我们先看一下make是如何工作的在默认的方式下,也就是我们只输入make命令.那么,1.make会在当前目录下找名字叫“Makefile”或“makefile”的文件.2.如果找到,它会找文件中的第一 ...