cloneNode小结
js原生API中有个cloneNode，还有一个可选的参数，
true代表复制子节点，包括任何包裹在标签之间的东西，当然包括文本节点，也就是标签之间有什么，它就会不假思索的全部都克隆一份。
false代表只复制节点本身，节点之间的任何东西都不用复制。
有时候，这个参数对于某些情况true false是相等的，比如没有任何子节点的复制,eg<div></div>
这不是本文所阐述的，本文阐述的是cloneNode在各种使用情况下对于是否复制事件表现的差异性：
例子页面：
<!doctype html>
<html>
<body>
<div id="myDiv" >
this is my div
</div>
</body>
添加事件
eg1.
<div id="myDiv" onclick="sayHello();">
this is my div
</div>
<script>
var elem = document.getElementById("myDiv");
//1.倘若放在dom节点属性onclick方法上，复制节点会复制出事件,新生成的dom也会附带上click事件
function sayHello(){
alert("say hello");
}
document.body.appendChild(elem.cloneNode(true));
</script>
eg2.
<div id="myDiv" >
this is my div
</div>
<script>
var elem = document.getElementById("myDiv");
//2.直接注册节点的click事件，cloneNode不会复制出事件
function sayHello(){
alert("say hello");
}
elem.onclick = sayHello();
document.body.appendChild(elem.cloneNode(true));
</script>
eg3.
<div id="myDiv" >
this is my div
</div>
<script>
function addEvent(elem, type, fn){
//cloneNode的时候，由此方法添加事件，新生产的节点会复制出事件
if(elem.attachEvent){
elem.attachEvent("on" + type, fn);
//cloneNode的时候，由此此方法添加事件，新生产的节点不会复制出事件
}else if(elem.addEventListener){
elem.addEventListener(type, fn, false);
}
}
var elem = document.getElementById("myDiv");
function sayHello(){
alert("say hello");
}
addEvent(elem, "click", sayHello);
document.body.appendChild(elem.cloneNode(true));
</script>
cloneNode小结的更多相关文章
- Javascript基础篇小结
转载请声明出处 博客原文 随手翻阅以前的学习笔记,顺便整理一下放在这里,方便自己复习,也希望你有也有帮助吧 第一课时 入门基础 知识点: 操作系统就是个应用程序 只要是应用程序都要占用物理内存 浏览器 ...
- 3月web前端面试小结
说一下box-sizing的应用场景 box-sizing的属性值分为两个,border-box和content-box,其中, border-box:width=content+padding+bo ...
- 从零开始编写自己的C#框架（26）——小结
一直想写个总结,不过实在太忙了,所以一直拖啊拖啊,拖到现在,不过也好,有了这段时间的沉淀,发现自己又有了小小的进步.哈哈...... 原想框架开发的相关开发步骤.文档.代码.功能.部署等都简单的讲过了 ...
- Python自然语言处理工具小结
Python自然语言处理工具小结 作者:白宁超 2016年11月21日21:45:26 目录 [Python NLP]干货!详述Python NLTK下如何使用stanford NLP工具包(1) [ ...
- java单向加密算法小结(2)--MD5哈希算法
上一篇文章整理了Base64算法的相关知识,严格来说,Base64只能算是一种编码方式而非加密算法,这一篇要说的MD5,其实也不算是加密算法,而是一种哈希算法,即将目标文本转化为固定长度,不可逆的字符 ...
- iOS--->微信支付小结
iOS--->微信支付小结 说起支付,除了支付宝支付之外,微信支付也是我们三方支付中最重要的方式之一,承接上面总结的支付宝,接下来把微信支付也总结了一下 ***那么首先还是由公司去创建并申请使用 ...
- iOS 之UITextFiled/UITextView小结
一:编辑被键盘遮挡的问题 参考自:http://blog.csdn.net/windkisshao/article/details/21398521 1.自定方法 ,用于移动视图 -(void)mov ...
- K近邻法(KNN)原理小结
K近邻法(k-nearst neighbors,KNN)是一种很基本的机器学习方法了,在我们平常的生活中也会不自主的应用.比如,我们判断一个人的人品,只需要观察他来往最密切的几个人的人品好坏就可以得出 ...
- scikit-learn随机森林调参小结
在Bagging与随机森林算法原理小结中,我们对随机森林(Random Forest, 以下简称RF)的原理做了总结.本文就从实践的角度对RF做一个总结.重点讲述scikit-learn中RF的调参注 ...
随机推荐
- 加密传输SSL协议8_Apache服务器的安装
学习了那么多的理论的知识,下面通过在Apache服务器中安装和使用SSL协议,实现安全传输,但是首先要安装好Apache服务器. Apache服务器的安装 Linux下所有的软件的原码的安装都是三部曲 ...
- 黑马程序员-- C语言变量作用域与代码块
这里通过变量作用域的两种错误用法来介绍一下C语言变量作用域 其次对代码块的使用进行了简单说明: #include <stdio.h> 1.变量的作用域(作用范围) 变量定义的那一行开始,直 ...
- c/c++:内存泄露和野指针的概念
内存泄漏 用动态存储分配函数动态开辟的空间,在使用完毕后未释放,结果导致一直占据该内存单元.直到程序结束.即所谓内存泄漏. 注意:内存泄漏是指堆内存的泄漏. 简单的说就是申请了一块内存空间,使用 ...
- 限制**类型物料不能输入BOM
应用 Oracle Bill Of Materiel 层 Level Function 函数名 Funcgtion Name CUX_BOMFDBOM 表单名 Form Name CUXBOMFD ...
- 可以把一堆dll文件放到程序目录下的一个自建目录里面
窦宁波大哥哥的那篇文章的这种写法还是很有参考价值的. QString strLibPath(QDir::toNativeSeparators(QApplication::applicationDirP ...
- Windows Azure 社区新闻综述（#71 版）
欢迎查看最新版本的每周综述,其中包含有关云计算和 Windows Azure的社区推动新闻.内容和对话. 以下是过去一周基于您的反馈汇集在一起的内容: 文章.视频和博客文章 · 使用 Azure ...
- C,C++经典(程序、错误程序)
1,程序 未执行完错误的return 0
- android开发利器--站在巨人肩膀上前行
本文主要介绍有助于android开发的三方平台和站点. 一:开发阶段 1:SVN(一个开放源码的版本号控制系统) 团队开发没有server,代码管理就没那么方便了,推荐taocode阿里开源站点,方便 ...
- Android 自动编译、打包生成apk文件 3 - 使用SDK Ant方式
相关文章列表: < Android 自动编译.打包生成apk文件 1 - 命令行方式> < Android 自动编译.打包生成apk文件 2 - 使用原生Ant方式> &l ...
- 从零开始学习UNITY3D(GUI篇 群组视图控件)
控件组可以看成一个大的容器,控件组里面的控件,相对位置已该控件组为基准,而不再已屏幕左上角为基准. 下面来看一下代码实例及其效果截图: public class GUI2 : MonoBehaviou ...