链式编程

1、原理：return this;

2、通常情况下，只有设置操作才能把链式编程延续下去。因为获取操作的时候，会返回获取到的相应的值，无法返回 this。

3、end()：结束当前链最近的一次过滤操作，并且返回匹配元素之前的状态。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="jquery-1.11.1.js"></script>

    <style>

        ul {

            list-style: none;

        }

        li {

            width: 50px;

            background-color: #cccccc;

            margin: 10px;

        }

    </style>

    <script>

        $(function () {

            $("button").click(function () {

                //end()会过滤一次返回$("li").eq(3)的对象

                $("li").eq(3).css("height", 50).prevAll().css("height", 100).end().css("backgroundColor", "red");

            });

        });

    </script>

</head>

<body>

<button>end()</button>

<ul>

    <li>0</li>

    <li>1</li>

    <li>2</li>

    <li>3</li>

    <li>4</li>

    <li>5</li>

</ul>

</body>

</html>

隐式迭代

1、含义：方法的内部会为匹配到的所有元素进行循环遍历，执行相应的方法；而不用我们再进行循环，简化我们的操作，方便我们调用。如果获取的是多元素的值，大部分情况下返回的是第一个元素的值

2、优点：jQuery这一特性相比较js而言，在注册事件上很方便，无需循环注册事件

3、each()：函数遍历；虽然有隐式迭代，但是对每个元素做不同的处理，这时候就用到了each方法

//参数一表示当前元素在所有匹配元素中的索引号

//参数二表示当前元素（DOM对象）

//element是一个js对象，需要转换成jquery对象

$(selector).each(function(index,element){});
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script src="jquery-1.11.1.js"></script>

    <style>

        span {

            font-size: 50px;

            cursor: pointer;

        }

    </style>

    <script>

        $(function () {

            //点到谁 谁就会变成实心的

            //

            $("span").mouseenter(function () {

                $(this).text("★").prevAll().text("★").end().nextAll().text("☆");

            });

            $("div").mouseleave(function () {

                $("span").each(function (index, ele) {

                    if ($(ele).attr("lighted") == 1) {

                        $(ele).text("★");

                    } else {

                        $(ele).text("☆");

                    }

                });

            });

            $("span").click(function () {

                $(this).attr("lighted", 1);

                $(this).prevAll().attr("lighted", 1);

                $(this).nextAll().attr("lighted", 0);

            });

        });

    </script>

</head>

<body>

<div>

    <span>☆</span>

    <span>☆</span>

    <span>☆</span>

    <span>☆</span>

    <span>☆</span>

</div>

</body>

</html>

jQuery——链式编程与隐式迭代的更多相关文章

  1. JQuery的链式编程，隐式迭代是啥意思？

    链式编程 1.好处 "一句话,链式编程可以省去很多重复的代码." 这话什么意思呢?举个例子. /*设置obj对象的两个属性*/ //普通做法是这样的 obj.name = '小明' ...

  2. JQuery的链式编程与隐式迭代

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 大数据技术之_16_Scala学习_06_面向对象编程-高级+隐式转换和隐式值

    第八章 面向对象编程-高级8.1 静态属性和静态方法8.1.1 静态属性-提出问题8.1.2 基本介绍8.1.3 伴生对象的快速入门8.1.4 伴生对象的小结8.1.5 最佳实践-使用伴生对象解决小孩 ...

  4. Scala 中的隐式转换和隐式参数

    隐式定义是指编译器为了修正类型错误而允许插入到程序中的定义. 举例: 正常情况下"120"/12显然会报错,因为 String 类并没有实现 / 这个方法,我们无法去决定 Stri ...

  5. Scala隐式转换和隐式参数

    隐式转换 Scala提供的隐式转换和隐式参数功能,是非常有特色的功能.是Java等编程语言所没有的功能.它可以允许你手动指定,将某种类型的对象转换成其他类型的对象或者是给一个类增加方法.通过这些功能, ...

  6. Scala基础：闭包、柯里化、隐式转换和隐式参数

    闭包,和js中的闭包一样,返回值依赖于声明在函数外部的一个或多个变量,那么这个函数就是闭包函数. val i: Int = 20 //函数func的方法体中使用了在func外部定义的变量 那func就 ...

  7. 12、scala隐式转换与隐式参数

    一.隐式转换 1.介绍 Scala提供的隐式转换和隐式参数功能,是非常有特色的功能.是Java等编程语言所没有的功能.它可以允许你手动指定,将某种类型的对象转换成其他类型的对象. 通过这些功能,可以实 ...

  8. Scala 学习之路（十三）—— 隐式转换和隐式参数

    一.隐式转换 1.1 使用隐式转换 隐式转换指的是以implicit关键字声明带有单个参数的转换函数,它将值从一种类型转换为另一种类型,以便使用之前类型所没有的功能.示例如下: // 普通人 clas ...

  9. Scala 系列（十三）—— 隐式转换和隐式参数

    一.隐式转换 1.1 使用隐式转换 隐式转换指的是以implicit关键字声明带有单个参数的转换函数,它将值从一种类型转换为另一种类型,以便使用之前类型所没有的功能.示例如下: // 普通人 clas ...

随机推荐

  1. [K3Cloud2.0]如何解决创建管理中心失败的问题

    标题有点大,实际上,Cloud2.0产品质量还是顶呱呱的,至于在安装使用过程中出现的这个管理中心无法创建的问题,实际上是与我的网络环境有关,下面讲一下我的网络环境: 开发团队目前所在网段:10.30. ...

  2. Parallelized coherent read and writeback transaction processing system for use in a packet switched cache coherent multiprocessor system

    A multiprocessor computer system is provided having a multiplicity of sub-systems and a main memory ...

  3. 设计模式：浅析 抽象工厂、工厂方法、简单(静态)工厂 java实现

    ----简单工厂 (也叫静态工厂模式):一个抽象产品抽象出多个详细产品类.一个详细工厂类 代码: //抽象产品角色 public interface Car{ public void drive(); ...

  4. Manthan, Codefest 16 F

    寻找树上最大权值和的两条不相交的路径. 树形DP题.挺难的,对于我…… 定义三个变量ma[MAXN], t[MAXN], sum[MAXN] 其中,ma[i]代表i子树中,最长的路径和 t[i]代表i ...

  5. 1. CountDiv 数数有几个 Compute number of integers divisible by k in range [a..b].

    package com.code; public class Test05_1 { public static int solution(int A, int B, int K) { // handl ...

  6. Windows 9立即公布了

    Windows 9技术预览版可能于今晚在美国旧金山举办的Windows公布会上宣布.下一代的Windows名称最有可能是Windows或Windows 9.网友猜想也可能是WIndows X或Wind ...

  7. C++学习之模板特例化

    模板是C++中一个很重要的特性,写一份代码能用于多种数据类型(包括用户自定义类型).例如,STL的sort()函数可以用于多种数据类型的排序,类stack可以用作多种数据类型的栈.但是,如果我们想对特 ...

  8. android 请求网络异步载入

    /** * 封装ProecssDialog对话框 * */ public class LoadDialog extends ProgressDialog { private String title ...

  9. WingIDE 5.0注冊机

    在wingIDE下开发python很方便,但IDE不是免费的,网上有破解的方法.请支持正版. 把下列文件CalcActivationCode.py载入到wingIDE中.LicenseID能够随便给一 ...

  10. unity3d-配置Android环境，打包发布Apk流程详解

    31:unity3d-配置Android环境,打包发布Apk流程详解 作者 阿西纳尼 关注 2016.08.28 22:52 字数 498 阅读 1806评论 0喜欢 5 Unity配置Android ...