关于jQuery的append方法不能多次添加同一个DOM元素的解决方法
资料来自:https://segmentfault.com/q/1010000007677851?_ea=1419689
append()方法在jQuery中是使用appendChild()实现的,实现原理如下代码:
append: function() {
return this.domManip( arguments, function( elem ) {
if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
var target = manipulationTarget( this, elem );
target.appendChild( elem );
}
});
}
框架中是通过appendChild来操作dom的,appendChild的作用是什么呢?请看w3c解答,它里面也提到可以将元素从一个元素移动到另一个元素,说白了,就是剪切的意思。因此你后面写的不是不起作用,而是在原地移动,因为就一个对象,你再怎么写也是一个。
解决方法:
1、将这个DOM元素写进append()中:
像这样:
$("xxx").append( " <p class='xxx'>·····</p> " );
2、使用克隆方法:
$("xxx").append($("td").clone());
clone()方法甚至可以复制事件处理程序
关于jQuery的clone()方法详情见:http://www.runoob.com/jquery/html-clone.html
关于jQuery的append方法不能多次添加同一个DOM元素的解决方法的更多相关文章
- 关于Cefsharp无法拖动Dom元素的解决方法
如图所显示,Cefsharp在嵌入网页,页面有对Dom元素的拖动的操作,独立在浏览器上对网页元素的拖动是没有问题的,但是嵌入到Cefsharp上显示禁用的图标.排查了H5的代码,没有写入禁用拖动的操作 ...
- JS-DOM ~ 03. 子节点的操作、style.样式和属性、dom元素的创建方法及操作、14个例题、主要是利用js直接控制html属性
带有Element和不带的区别 a) 带Element的获取的是元素节点 b) 不带可能获取文本节点和属性节点 获取所以子节点 a) . childNodes b) . children ...
- Html开发中document.getElementByTagName无法找到所有DOM元素的问题解决方法
let eleList = document.querySelectorAll('li') for (let i = 0; i < eleList.length; i++) { // 遍历操作 ...
- JabRef中添加中文文献出现乱码 解决方法
JabRef中添加中文文献出现乱码 解决方法 问题描述 JaBRef是一款开源的文献管理软件,主要用来管理bibtex格式的参考文献,可以与LATEX配合使用,方便论文参考文献的使用.文献管理 ...
- add() 方法用于向 <select> 添加一个 <option> 元素。
//add() 方法用于向 <select> 添加一个 <option> 元素. //new Option() 创建一个option标签 school.add(new Opti ...
- JQuery this和$(this)的区别及获取$(this)子元素对象的方法
1.JQuery this和$(this)的区别 相信很多刚接触JQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢? 首先来看看JQuery中的 $() 这 ...
- jquery无法为动态生成的元素添加点击事件的解决方法
遇到 jquery无法为动态生成的元素添加点击事件,谷歌一下,整理一下解决方法如下: (<li>中间的元素是动态生成的), 现在想为<i>添加点击事件, 例子如下: <d ...
- 转: JQuery this和$(this)的区别及获取$(this)子元素对象的方法
1.JQuery this和$(this)的区别 相信很多刚接触JQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢? 首先来看看JQuery中的 $() 这 ...
- jQuery之JSP加载JS文件不起作用的有效解决方法
JSP加载JS文件不起作用的有效解决方法 作者: 字体:[增加 减小] 类型:转载 时间:2014-04-08 jsp导入jquery文件,老是不起作用,原因在于其不能访问/WEB-INF/目录下的文 ...
随机推荐
- Nacos环境搭建
先去下载↓↓↓↓ https://github.com/alibaba/nacos/releases 单机版 单机版主要为了测试,没啥意思,你下载一个zip包,然后解压,进入bin目录,双击 star ...
- python爬虫学习笔记
爬虫的分类 1.通用爬虫:通用爬虫是搜索引擎(Baidu.Google.Yahoo等)“抓取系统”的重要组成部分.主要目的是将互联网上的网页下载到本地,形成一个互联网内容的镜像备份. 简单来讲就是尽可 ...
- js 遍历集合删除元素
js 遍历集合删除元素 /** * 有效的方式 - 改变下标,控制遍历 */ for (var i = 0; i < arr.length; i++) { if (...) { arr.spli ...
- [C#] .NET4.0中使用4.5中的 async/await 功能实现异步
在.NET Framework 4.5中添加了新的异步操作库,但是在.NET Framework 4.0中却无法使用.这时不免面临着抉择,到底是升级整个解决方案还是不使用呢? 如果你的软件还没发布出去 ...
- (五)聊一聊深Copy与浅Copy
一.关于浅copy与深copy 首先说明一下: 在python中,赋值其实就是对象的引用,变量就是对象的一个标签,如果把内存对象比喻成一个个房间,那么变量就是门牌号. 深copy与浅copy只是针对可 ...
- 自编译Apache Spark2.3.3支持CDH5.16.1
1 下载源代码文件 https://archive.apache.org/dist/spark/spark-2.3.3/ 2 解压后导入编辑器,修改依赖的Hadoop版本,下面截图是修改后的,要看自己 ...
- word20170104办签证 Visa application有用的词和句子
有用的词:visa category: 签证类型tourist visa: 旅游签证visa interview: 签证面试multiple entries: 多次往返visa on arrival: ...
- 软件测试面试必问--bug交互流程
目前市场主要用的bug管理工具:禅道.jira.QC.bugfree等,当然也有自己公司开发的. 不过不管哪一种工具,核心交互流程都是差不多的,只是字段的名称不一样而已,参考如下两张示意图: 这是前几 ...
- git查日志命令
git常用命令 1.创建仓库 a.当前目录创建仓库,即把当前目录的文件开始用git管理,该命令会在当前目录下创建一个.git目录 git init b.指定目录创建仓库 git init 目录名 2. ...
- excel2json
原文链接 在游戏项目中一般都需要由策划制作大量的游戏内容,其中很大一部分是使用Excel表来制作的.于是程序就需要把Excel文件转换成程序方便读取的格式. 之前项目使用的Excel表导入工具都是通过 ...