jquery学习之add()
解读:
add() 将元素添加到匹配元素的集合中
例1:
<!DOCTYPE html>
<html>
<head>
<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 language="JavaScript" type="text/JavaScript" src="http://www.w3school.com.cn/jquery/jquery.js"></script>
<script>
$(document).ready(function(){
$("div").css("border", "2px solid red").add("p").css("background", "yellow");
});
</script>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<p>Added this… (notice no border)</p>
</body>
</html>
结果如下图所示:

解说:这里的add("p")相当于和的意思,就是说$("div")的css和p的css。这里注意的是div是有边框的。而p没有。
例2:
<body>
<p>Hello</p><span>Hello Again</span>
</body>
$("p").add("span").css("background", "yellow");
结果如下图所示:

p和span的css,相当于
$("p,span").css("background","yellow");
例三:
<body>
<p>Hello</p>
</body>
$("p").clone().add("<span>Again</span>").appendTo(document.body);
结果如下:

clone()复制的意思;复制一个p和把<span>Again</span>插入到文档的body中。
这里插一句:如果不用clone(),则原来的p不存在了。
例四:
<body>
<p>Hello</p><span id="a">Hello Again</span>
</body>
$("p").add(document.getElementById("a")).css("background", "yellow");
结果如下:

这表明add()中的参数不仅可以是选择器,也可以是DOM元素。
转自:http://blog.csdn.net/zm2714/article/details/8119554
jquery学习之add()的更多相关文章
- jQuery 学习笔记
jQuery 学习笔记 一.jQuery概述 宗旨: Write Less, Do More. 基础知识: 1.符号$代替document.getElementById( ...
- jQuery学习笔记 - 基础知识扫盲入门篇
jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...
- 很不错的jQuery学习资料和实例
这些都是学习Jquery很不错的资料,整理了一下,分享给大家. 希望能对大家的学习有帮助. 帕兰 Noupe带来的51个最佳jQuery教程和实例, 向大家介绍了jQuery的一些基本概念和使用的相关 ...
- jQuery学习-事件之绑定事件(二)
在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) { ...
- jQuery学习笔记之概念(1)
jQuery学习笔记之概念(1) ----------------------学习目录-------------------- 1.概念 2.特点 3.选择器 4.DOM操作 5.事件 6.jQuer ...
- jquery学习随笔
转)jquery学习随笔(jquery选择器) jQuery的选择器是CSS 1-3,XPath的结合物.jQuery提取这二种查询语言最好的部分,融合后创造出了最终的jQuery表达式查询语言. ...
- jQuery学习之路(1)-选择器
▓▓▓▓▓▓ 大致介绍 终于开始了我的jQuery学习之路!感觉不能再拖了,要边学习原生JavaScript边学习jQuery jQuery是什么? jQuery是一个快速.简洁的JavaScript ...
- jquery学习(一)
简单的jquery学习,首先在页面引入jquery <!-- 引入jquery --> <script src="js/jquery-1.8.3.js" type ...
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
随机推荐
- HDU暑假多校第六场K-werewolf
一.题意 好人必然说真话,坏人不一定说真话,给定N个人的言论<每人一个发言.不谈及自己>,要求指出有多少个人一定是好人,有多少个人一定是坏人.#define 狼人 坏人#define 村民 ...
- [KAFKA]kafka常用操作
-- kafka路径示例 /opt/cloudera/parcels/KAFKA/bin-- kafka启动./kafka-server-start.sh -daemon ../config/serv ...
- VI的配置
vi下设置tab键为4个空格 在每个用户的主目录下,都有一个 vi 的配置文件".vimrc"或".exrc",没有的可以新建一个.用户可以编辑它,使这些设置在 ...
- 关于transition动画下,如果有fixed元素,渲染的奇葩问题
之前我们机票页面有生成一个低价日历,然后我们有一个需求就是滚动到那个月份,对应显示这个月,然后这个区域是fixed定位的,然后奇怪的事情发生了,就是低价日历的动画执行完后,修改页面的html却没有正常 ...
- 【Luogu P4644】Cleaning Shifts
题目 给定 \(n\) 个区间 \([a_i, b_i]\), 花费为 \(c_i\), 求覆盖 \([L, R]\) 区间的所有整数的最小花费. \(0\le n \le 10^4, 0\le L, ...
- Android当代码方法超过65536个时,在2.3机器上会不能安装,出现INSTALL_FAILED_DEXOPT错误
今天打包时,发现2.3机器,产生的APK在某些机器上不能安装(Installation error: INSTALL_FAILED_DEXOPT),针对这个问题的一个可能解释是:最新的ADT和SDK ...
- ES5新增数组方法(3):some
检查数组元素中是否有元素符合指定. // 数组中的元素部分满足指定条件返回true let arr = [1, 3, 5, 7, 9]; console.log(arr.some((value, in ...
- 第三十四篇 Python面向对象之 反射(自省)
什么是反射? 反射的概念是由Smith在1982年提出的,主要是指程序可以访问.检测和修改它本身状态或行为的一种能力(自省).这一概念的提出很快引发了计算机科学领域关于应用反射性的研究.它首先被程序语 ...
- js中DOM 节点的一些操作方法
什么是DOM DOM:文档对象模型.DOM 为文档提供了结构化表示,并定义了如何通过脚本来访问文档结构.目的其实就是为了能让js操作html元素而制定的一个规范. DOM就是由节点组成的. 解析过程 ...
- JVM(1)——简介
网上流传着一段挺有意思的话-- 对于从事C或C++的开发人员来说,他们既是内存管理的最高权力的皇帝,也是最基础的劳动人民,担负着每一个对象生命开始到终结的维护工作,有点光杆司令的赶脚. 但对于java ...