jQuery的 .add 很像一个collection, 官方的这个demo很形象的表达了这个意思。

 <!doctype html>

 <html lang="en">

 <head>

 <meta charset="utf-8">

 <title>add demo</title>

 <script src="//code.jquery.com/jquery-1.10.2.js"></script>

 </head>

 <body>

 <p>Hello</p>

 <span id="a">Hello Again</span>

 <script>

 var collection = $( "p" );

 // Capture the new collection

 collection = collection.add( document.getElementById( "a" ) );

 collection.css( "background", "yellow" );

 </script>

 </body>

 </html>

虽然像collection, 但注意下面的不同：

var pdiv = $("p");

pdiv.add("div")

pdiv.css("background-color", "green" );

上面的代码， 只p背景色变为绿, div的背景色不变。

改为下面这样，div的背景色才会也变成绿色。

var pdiv = $("p");

pdiv = pdiv.add("div")

pdiv.css("background-color", "green" );

这种“断链”的问题同样表现在下面的demo中，（jQuery官网中的Examples中）

 <!doctype html>

 <html lang="en">

 <head>

   <meta charset="utf-8">

   <title>add demo</title>

   <style>

   div {

     width: 60px;

     height: 60px;

     margin: 10px;

     float: left;

   }

   p {

     clear: left;

     font-weight: bold;

     font-size: 16px;

     color: blue;

     margin: 0 10px;

     padding: 2px;

   }

   </style>

   <script src="//code.jquery.com/jquery-1.10.2.js"></script>

 </head>

 <body>

 <div></div>

 <div></div>

 <div></div>

 <div></div>

 <div></div>

 <div></div>

 <p>Added this... (notice no border)</p>

 <script>

 $( "div" ).css( "border", "2px solid red" )

   .add( "p" )

   .css( "background", "yellow" );

 </script>

 </body>

 </html>

API - .add()的更多相关文章

  1. sharepoint rest api Add ListItem 报错

    Recently, I was trying to create a list item using Rest API on Sharepoint 2013. I got the following ...

  2. [转载] FFmpeg API 变更记录

    最近一两年内FFmpeg项目发展的速度很快,本来是一件好事.但是随之而来的问题就是其API(接口函数)一直在发生变动.这么一来基于旧一点版本的FFmpeg的程序的代码在最新的类库上可能就跑不通了. 例 ...

  3. 【windows核心编程】一个API拦截的例子

    API拦截 修改PE文件导入段中的导入函数地址 为 新的函数地址 这涉及PE文件格式中的导入表和IAT,PE文件中每个隐式链接的DLL对应一个IMAGE_IMPORT_DESCRIPTOR描述符结构, ...

  4. FFmpeg API 变更记录

    最近一两年内FFmpeg项目发展的速度很快,本来是一件好事.但是随之而来的问题就是其API(接口函数)一直在发生变动.这么一来基于旧一点版本的FFmpeg的程序的代码在最新的类库上可能就跑不通了. 例 ...

  5. 使用 Flask-Docs 自动生成 Api 文档

    影响我写文档的原因可能是代码和文档分离,有时候写完代码会忘记补文档,而且不能及时查看,使用 Flask-Docs 可以解决我的问题,这个插件可以根据代码注释生成文档页面,代码注释改动文档可以及时更新, ...

  6. Jquery API学习笔记

    学习网站 JQuery API 中文网: http://www.jquery123.com/ 学习一遍API可以更熟练的运用jquery并且拓展思路. 这里只挑选了一些我认为在开发中会用到的一些API ...

  7. [转]Using $select, $expand, and $value in ASP.NET Web API 2 OData

    本文转自:https://docs.microsoft.com/en-us/aspnet/web-api/overview/odata-support-in-aspnet-web-api/using- ...

  8. 20款 JavaScript 开发框架推荐给前端开发者

    下面,我们给大家提供了一个用于 HTML5 开发的各种用途的 JavaScript 库列表.这些框架能够给前端开发人员提供更好的功能实现的解决方案.如果你有收藏优秀的框架,也可以在后面的评论中分享给我 ...

  9. remove name="ProxyModule“会导致重复执行

    <?xml version="1.0" encoding="utf-8"?> <!-- 有关如何配置 ASP.NET 应用程序的详细信息,请访 ...

随机推荐

  1. 如何退出Flex手机项目？

    在Flex创建的手机项目中,可以使用以下代码来关闭/退出程序. NativeApplication.nativeApplication.exit(); 显示代码

  2. 打印从1到最大的n位数

    //和剑指offer程序基本一致,不过print和进位两部分合并在一个程序中 //如果把其分拆,进行适当的整理,代码会更加整洁 void PrintToMaxOfDigitsN(int n) { ) ...

  3. (转）C# Base64

    本文原地址:http://blog.csdn.net/zhoufoxcn/article/details/1497092 作者:周公 using System;using System.Text; n ...

  4. 1314: ZZY的困惑

    1314: ZZY的困惑 Time Limit: 2 Sec  Memory Limit: 128 M[Submit][Status][Web Board] Description ZZY有很多爱好~ ...

  5. C++编译错误syntax error : identifier 'THIS_FILE' 解决方法

    你到代码里搜索 THIS_FILE看是不是它定义在别的头文件前面了,如果是,把它们的头文件紧跟到Stdafx.h后面 我遇到过这问题,这样搞定的 今天遇到个编译错误:..\vc98\include\n ...

  6. ORA-01461: 仅可以为插入 LONG 列的 LONG 值赋值”解决办法

    ORA-01461: 仅可以为插入 LONG 列的 LONG 值赋值”解决办法 今天遇到的一个问题: 直接修改数据表中的某些字段数据内容时报错: ORA-01461: 仅可以为插入 LONG 列的 L ...

  7. 使用git向github中添加项目并更新（备忘录）

    今天使用Git&github&ST3时,发现ST3不仅是git插件不能push成功,使用sublimegit插件也不行. 可能是没有掌握sublimegit的使用技巧,有待后续继续摸索 ...

  8. flex经验记录（转载）

    最近一直忙于项目,很好抽出时间学习,刚忙里偷闲浏览博客看到一位博友总结的一些flex的经验,感觉不错就转载过来,一来扩散一下,二来保存下来,以后忘记的时候可以回来学习下. 原博文地址:http://b ...

  9. 数据结构-多级指针单链表(C语言)

    偶尔看到大一时候写了一个多级链表,听起来好有趣,稍微整理一下. 稍微注意一下两点: 1.指针是一个地址,他自己也是有一个地址.一级指针(带一个*号)表示一级地址,他自身地址为二级地址.二级指针(带两个 ...

  10. EXT学习之——Extjs 文本框 TextField 添加点击（onclick）事件方法

    { xtype:'textfield', listeners: { render: function(p) { // Append the Panel to the click handler's a ...