JQuery_DOM 节点操作之复制、替换和 删除节点
一、复制节点
<script type="text/javascript" src="jquery-1.12.3.min.js"></script>
<script>
$(function(){
$("div").click(function(){
alert("fasdf")
})
$('body').append($('div').clone(true)); //复制一个节点添加到HTML 中
});
</script>
</head>
<body>
<div>几点</div>
</body>
clone(true)参数可以为空，表示只复制元素和内容，不复制事件行为。而加上true参数的话，这个元素附带的事件处理行为也复制出来。
二、删除节点
<script type="text/javascript" src="jquery-1.12.3.min.js"></script>
<script>
$(function(){
$('div').remove(); //直接删除div 元素
});
</script>
</head>
<body>
<div>几点</div>
</body>
.remove()不带参数时，删除前面对象选择器指定的元素。而.remove()本事也可以带选择符参数的，比如：$('div').remove('#box');只删除id=box 的div。
.remove()和.detach()都是删除节点，而删除后本身方法可以返回当前被删除的节点对象，但区别在于前者在恢复时不保留事件行为，后者则保留。
<script type="text/javascript" src="jquery-1.12.3.min.js"></script>
<script>
$(function(){
$("div").click(function(){
alert("fasdf")
});
//$('div').remove().appendTo('body'); //直接删除div 元素后再添加回去不保留事件
$('div').detach().appendTo('body');//直接删除div 元素后再添加回去保留事件
});
</script>
</head>
<body>
<div>几点</div>
</body>
三、清空节点
<script type="text/javascript" src="jquery-1.12.3.min.js"></script>
<script>
$(function(){
$('div').empty(); //删除掉节点里的内容
});
</script>
</head>
<body>
<div>几点</div>
</body>
四、替换节点
<script type="text/javascript" src="jquery-1.12.3.min.js"></script>
<script>
$(function(){
$('div').replaceWith('<span>节点</span>'); //将div 替换成span 元素
//$('<span>节点</span>').replaceAll('div'); //同上
});
</script>
</head>
<body>
<div>几点</div>
</body>
节点被替换后，所包含的事件行为就全部消失了。
JQuery_DOM 节点操作之复制、替换和 删除节点的更多相关文章
- jquery插入,复制、替换和删除节点
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- python3.4学习笔记(十五) 字符串操作（string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等）
python3.4学习笔记(十五) 字符串操作(string替换.删除.截取.复制.连接.比较.查找.包含.大小写转换.分割等) python print 不换行(在后面加上,end=''),prin ...
- 转 Python 字符串操作（string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等）
转自: http://www.cnblogs.com/huangcong/archive/2011/08/29/2158268.html 黄聪:Python 字符串操作(string替换.删除.截取. ...
- neo4j 将一个节点的属性复制到另一个节点上
在使用Python操作Neo4j数据库的时候,经常会遇到重复的节点,需要将一个节点的属性复制到另一个节点,之后将该节点删除. def copy_node_properties(source_node_ ...
- (转载)html dom节点操作(获取/修改/添加或删除)
DOM 是关于如何获取.修改.添加或删除 HTML 元素的标准,下面为大家介绍下html dom节点操作,感兴趣的朋友可以参考下 HTML DOM 是关于如何获取.修改.添加或删除 HTML 元素 ...
- JavaScript之节点的创建、替换、删除、插入
1.节点的创建 节点的创建使用document.creatElment();文本节点的创建使用document.creatTextNode();如想把<li>哈密瓜</li>添 ...
- jQuery - 02. 样式表属性操作/类操作、动画、显示隐藏、滑入、淡入、停止动画、节点操作、添加对象、清空节点
样式表属性操作.css $("div").css({'width':100,'height':100,'background':'red'}); $("div" ...
- redis 集群新增节点，slots槽分配，删除节点， [ERR] Calling MIGRATE ERR Syntax error, try CLIENT (LIST | KILL | GET...
redis reshard 重新分槽(slots) https://github.com/antirez/redis/issues/5029 redis 官方已确认该bug redis 集群重新(re ...
- Python 字符串操作（string替换、删除、截取、复制、连接、比较、查找、包含、大小写转换、分割等）
去空格及特殊符号 s.strip().lstrip().rstrip(',') 复制字符串 #strcpy(sStr1,sStr2) sStr1 = 'strcpy' sStr2 = sStr1 sS ...
随机推荐
- iptables 设置肯限制流量
1.查看本机关于IPTABLES的设置情况 [root@tp ~]# iptables -L -n Chain INPUT (policy ACCEPT) target prot opt source ...
- IPC-->PIPO
Programing python 4th page 228 """ IPC http://www.cnblogs.com/BoyXiao/archive/2011/01 ...
- 基于webpack使用ES6新特性(转载)
本文转载自: http://www.tuicool.com/articles/vye2ea6
- Microsoft Visual Studio 2015激活密匙
企业版:http://download.microsoft.com/download/B/8/F/B8F1470D-2396-4E7A-83F5-AC09154EB925/vs2015.ent_chs ...
- linux-bash shell学习
什么是shell?shell就相当于是计算机给我提供的一个操作系统的接口,这里说的bash shell是一种命令行方面的软件,提供给用户来操作系统.
- Hadoop：部署Hadoop Single Node
一.环境准备 1.系统环境 CentOS 7 2.软件环境 OpenJDK # 查询可安装的OpenJDK软件包[root@server1] yum search java | grep jdk... ...
- linux下TCP/IP及内核参数优化调优(转）
Linux下TCP/IP及内核参数优化有多种方式,参数配置得当可以大大提高系统的性能,也可以根据特定场景进行专门的优化,如TIME_WAIT过高,DDOS攻击等等. 如下配置是写在sysctl.con ...
- Spring之ClassPathResource加载资源文件
先看Demo: 1 @Test 2 public void testClassPathResource() throws IOException { 3 Resource res = new Clas ...
- java中常见的几种异常
算术异常类:ArithmeticExecption空指针异常类:NullPointerException类型强制转换异常:ClassCastException数组负下标异常:NegativeArray ...
- maven国内镜像（maven下载慢的解决方法）
Maven是当前流行的项目管理工具,但官方的库在国外经常连不上,连上也下载速度很慢.国内oschina的maven服务器很早之前就关了.今天发现阿里云的一个中央仓库,亲测可用. <mirror& ...