javascript节点操作appendChild()

cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝
true:表示执行深拷贝,复制本节点以及整个子节点树.
false:浅拷贝.只复制节点本身.
复制后返回的节点副本属于文档所有,但是并没有父节点.除非使用appendChild,insertChild(),replaceChild()将它添加到文档

1 var oDiv = document.getElementById("guoDiv");
2             var deepList = oDiv.cloneNode(true); //拷贝子节点
3             alert(deepList.childNodes.length); //3或7(兼容性问题,所以结果不一样)
4             var showList = oDiv.cloneNode(false); //只拷贝当前元素的引用
5             alert(showList.childNodes.length); //0

 

你可能感兴趣的:(appendChild)

  • web前端常见的面试题总结 2401_84436095 程序员前端
    script.src=url+‘?’+data+‘callback=’+funcNamedocument.body.appendChild(script);//这里得到请求的数据，在回调函数中执行处理window[funcName]=function(data){callback(data)}}//使用jsonp(‘http:127.0.0.1:3000/api’,{},function(res)
  • javascript添加p元素，html添加文字，appendChild 游勇一 javascripthtml添加pappendChild
    javascript添加p元素，html添加文字，appendChild。网页添加p元素效果截图。个人签名：游志勇，预制板，南托岭预制场。文字展示#wordsadd{font-size:70px;word-break:break-all;}#wordsaddp{margin:002px0;padding:002px0;line-height:93%;}.btn_width{width:90px;}
  • 2018-05-24 萧声断未央
    //1.创建一个元素vara=document.createElement('a');//2.给元素添加属性或内容：a.href='http://www.baidu.com';a.innerHTML='GOBAIDU';//3.追加到dom树父元素.appendChild(子元素);document.querySelector('div').appendChild(a);varjson='[{"e
  • JS面试题--DOM操作相关 这碗花里只有粥 #JSJS面试题DOM操作
    （1）在DOM中操作中怎么创建、添加、删除、移除、替换、插入和查找节点①通过以下代码创建节点createDocumentFragment()//创建一个DOM片段createElement();//创建一个具体的元素createTextNode();//创建一个文本节点②添加、移除、替换、插入节点appendChild();removeChild();replaceChild();insertBe
  • js中怎样添加、移出、插入、复制、创建？ 一个大长腿 javascript开发语言ecmascript
    在JavaScript中，可以使用以下方法来添加、移除、插入、复制和创建元素：添加元素：使用appendChild()方法将一个子元素添加到指定父元素的末尾。使用insertBefore()方法将一个子元素插入到指定父元素的指定位置之前。移除元素：使用removeChild()方法从父元素中移除指定的子元素。插入元素：使用insertAdjacentHTML()方法在指定元素的相对位置插入HTML
  • 节点上的操作 嘉图_邵
    一、创建节点document.createElement():创建新元素，这个方法只接收一个参数，元素的标签名document.createTextNode()创建文本节点，参数为字符串文本二、插入节点appendChild()插入指定的节点使其成为那个节点的最后一个子节点在插入的元素节点上调用insertBefore(新节点，参照节点)第一个参数:待插入的节点第二个参数：已存在的节点，新节点将插
  • 封装的一些函数 岳小弟
    //标签后面插入元素functioninsertAfter(newElement,targetElement){varparent=targetElement.parentNode;if(parent.lastChild==targetElement){parent.appendChild(newElement,targetElement);}else{parent.insertBefore(ne
  • uniapp复制（解决uni.setClipboardData某些机型h5不支持） 王哈哈的学习笔记 uni-app前端linux
    /***复制到剪贴板*@param{Object}content*/$copy(content){//#ifdefH5lettransfer=document.createElement('input');document.body.appendChild(transfer);transfer.value=content;transfer.select();if(document.execComm
  • 前端常用函数功能整理 2019-12-06 Febby315
    简单页面注入分析测试//注入jquery便于解析操作DOM元素varjqueryEle=document.createElement("script");jqueryEle.src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js";document.body.appendChild(jqueryEle);//注入moment便于解析操作
  • jsonp包装 织雪纱奈
    functionaddScriptTag(src){varscript=document.createElement('script');script.setAttribute("type","text/javascript");script.src=src;document.body.appendChild(script);}window.onload=function(){addScriptT
  • JS实现一键复制、选中复制、选中多行复制 六卿 #jsjavascript前端js复制js选中复制复制粘贴
    JS实现一键复制首先我们准备一份通用的一键复制代码：exportfunctioncopyTextFun(text){if(!text)returnfalsevartextarea=document.createElement('textarea')textarea.value=textdocument.body.appendChild(textarea)textarea.select()messa
  • VUE2模拟VUE3中的Teleport实现改变元素挂载的节点 灰海 javascript前端teleportvue
    Teleport页面exportdefault{name:'teleport',props:{to:{type:String,required:true}},mounted(){consttoEl=document.querySelector(this.to)if(toEl){toEl.appendChild(this.$el)}},destroyed(){consttoEl=document.q
  • js原生实现复制内容到粘贴板 gem_Y
    privatecopyUrl=(url:string)=>()=>{lettextArea=document.createElement('textArea')textArea.innerText=urldocument.body.appendChild(textArea)//console.log(textArea)varrange=document.createRange();//创建一个ra
  • 81 js复制功能 滔滔逐浪
    Titlewelcome请点击复制functioncopyText(){varUrl2=document.getElementById("keydiv").innerText;varoInput=document.createElement("input");oInput.value=Url2;document.body.appendChild(oInput);oInput.select();do
  • DOM要点总结 淳平讲Java javascript开发语言前端
    一、基本介绍在HTMLDOM（文档对象模型）中，每个部分都是节点：1)文档本身是文档节点2)所有HTML元素是元素节点3)所有HTML属性是属性节点4)HTML元素内的文本是文本节点5)注释是注释节点二、节点常用方法1.通过具体的元素节点调用getElementsByTagName()方法，获取当前节点的指定标签名孩子节点2.appendChild(oChildNode)方法，可以添加一个子节点，
  • 浏览器 Event Loop Chen_JF
    导语本文的内容是浏览器的事件循环，并不是nodejs的事件循环，不要将两者混淆。我们先从一段代码开始：document.body.appendChild(el)el.style.display='none'这两句代码先把一个元素添加到body，然后隐藏它。从直观上来理解，可能大部分人觉得如此操作会导致页面闪动，因此编码时经常会交换两句的顺序：先隐藏再添加。但实际上两者写法都不会造成闪动，因为他们都
  • 关于js报错信息Uncaught TypeError: Cannot read properties of null (reading ‘appendChild‘)； eclipse_ali htmlhtml5javascript
    关于js报错信息UncaughtTypeError:Cannotreadpropertiesofnull(reading‘appendChild’);我在js文件中生成标签并加入body中，发现提示无法读取body，原因是js在页面生成前就已经执行所以获取不到body解决方法：将appendhild或者需要获取body标签的js代码或文件放在body内部或者body标签后Document//放中间
  • 前端JS实现简易一键复制黏贴函数(可复制换行) Xiaop
    废话不多说,直接上代码,有问题下面或者私信讨论哈定义functioncopy(copyContent){//1.创建并添加一个输入框元素(最后会销毁)consttextareaEle=document.createElement("textarea");document.body.appendChild(textareaEle);//2.将需要复制的文本传入输入框,并调用select方法,选中输入
  • JSONP的基本使用 GoFzy
    一、准备好一个不同源的数据接口AJAX跨域请求varscript=document.createElement('script');script.src='http://first.com/JSONP_server.php';document.body.appendChild(script);functionfoo(data){console.log(data);}  现在我们就可以直接在浏览器中
  • JavaScript 操作dom节点 创建 添加 移除 替换 插入 复制 查找 歌声缓缓
    创建createElement添加appendChild移除removeChild替换replaceChild（newnode,node）插入insertBefore(newnode,node)复制cloneNode(true)//false浅拷贝（只复制节点本身）true深拷贝(复制本节点以及整个子节点树)查找document.getElementById("box")document.getE
  • 教你用JavaScript制作鼠标特效 小院里的霍大侠 Web编程入门javascript前端开发语言经验分享
    案例介绍欢迎来的我的小院，我是霍大侠，恭喜你今天又要进步一点点了！我们来用JavaScript编程实战案例，做一个鼠标爱心特效。鼠标在页面移动时会出现彩色爱心特效。通过实战我们将学会createElement方法、appendChild方法、setTimeout方法。案例演示页面出现后，鼠标在页面上移动产生彩色爱心特效。案例设计我们来看此案例的思维导图设计，包括需求描述，页面设计和技术架构。其中架
  • html页面添加水印 robotlee8
    letinfo={name:"小明",phone:"9527"};functionwatermark(info){if(!info&&!info.phone&&!info.name){return;}letuserInfo=info;letc=document.createElement("canvas");document.body.appendChild.c;letctx=c.getConte
  • vue2中实现一个可移动的弹框 甘道夫老矣
    先创建一个可拖拽的外壳mounted(){this.theDrag();},methods:{//拖拽theDrag(){//创建容器letcontainer=window.document.body;//将创建的div添加到容器中container.appendChild(window.document.getElementById("theDrag"));//获取到boxletbox=wind
  • 前端下载文件 又尔D. 前端
    1、直接下载(后端提供下载url地址）``downloadPdf(id).then(res=>{if(res.success&&res.code==200){letur=res.result;//下载地址consta=document.createElement('a');a.href=url;a.style.display='none';document.body.appendChild(a);
  • JavaScript第十章DOM 27亿光年中的小小尘埃
    节点层次文档元素htmlNode类型每个节点都有nodeType,可根据nodeType来判断系欸DNA类型，详见高程248页节点关系，每个节点都有childNodes属性，保存着NodeList类数组对象操作节点:appendChild()：在末尾添加节点insertBefore()：接收两个参数，第一个为需要插入的节点，第二个为插入节点的位置replaceChild()：替换节点，要替换的节点
  • html5实现粒子效果的文字,利用HTML5实现Canvas粒子文字特效 Dr.Blaine html5实现粒子效果的文字
    特效描述：利用HTML5实现Canvas粒子文字特效。利用HTML5实现Canvas粒子文字特效代码结构1.HTML代码change/*jshintesversion:6*/varcan=document.createElement("canvas");document.body.appendChild(can);varctx=can.getContext('2d');functionresize
  • 2401dom,自动给表格加宽度 fqbqrr jschromejs
    参考文档functionjys(f,w){//加上头宽度.varth=document.createElement("th");th.setAttribute('width',w);//'20%'f.appendChild(th);//加多宽的节点.}对想要更改的表格,更改或添加宽度:functiongxt(){l=qa('.memberdeclstbodytr.heading');//该选择器选
  • DOM结构操作 loushumei
    新增、插入节点createElementappendChild//容器constdiv1=document.getElementById('div1')//新建节点constnewp=document.createElement('p')newp.innerHTML="thisisnewp"//插入节点div1.appendChild(newp)//移动节点对现有节点进行appendChild操作
  • js添加、删除、替换或插入元素。 恰小面包 javascript开发语言前端
    在JavaScript中，有多种方式可以添加、删除、替换或插入元素。以下是一些基本示例：添加元素：添加到DOM元素的末尾：javascript`letelement=document.createElement('div');element.textContent='新元素';document.body.appendChild(element);`添加到指定元素的前面：javascript`let
  • 解决IE浏览器报错，对象不支持“remove”属性或方法 前端李十三 前端javascript开发语言
    functiondoPostData(){varform=document.createElement("form");form.style.display="none";form.action='http://localhost:8580/test/doPostData';form.method="post";document.body.appendChild(form);form.submit
  • Java常用排序算法/程序员必须掌握的8大排序算法 cugfy java
    分类： 1）插入排序（直接插入排序、希尔排序） 2）交换排序（冒泡排序、快速排序） 3）选择排序（直接选择排序、堆排序） 4）归并排序 5）分配排序（基数排序） 所需辅助空间最多：归并排序 所需辅助空间最少：堆排序 平均速度最快：快速排序 不稳定：快速排序，希尔排序，堆排序。 先来看看8种排序之间的关系：   1.直接插入排序 （1
  • 【Spark102】Spark存储模块BlockManager剖析 bit1129 manager
    Spark围绕着BlockManager构建了存储模块，包括RDD，Shuffle，Broadcast的存储都使用了BlockManager。而BlockManager在实现上是一个针对每个应用的Master/Executor结构，即Driver上BlockManager充当了Master角色，而各个Slave上(具体到应用范围，就是Executor)的BlockManager充当了Slave角色
  • linux 查看端口被占用情况详解 daizj linux端口占用netstatlsof
    经常在启动一个程序会碰到端口被占用，这里讲一下怎么查看端口是否被占用，及哪个程序占用，怎么Kill掉已占用端口的程序   1、lsof -i:port port为端口号   [root@slave /data/spark-1.4.0-bin-cdh4]# lsof -i:8080 COMMAND   PID USER   FD   TY
  • Hosts文件使用 周凡杨 hostslocahost
         一切都要从localhost说起，经常在tomcat容器起动后，访问页面时输入http://localhost:8088/index.jsp，大家都知道localhost代表本机地址，如果本机IP是10.10.134.21，那就相当于http://10.10.134.21:8088/index.jsp，有时候也会看到http: 127.0.0.1:
  • java excel工具 g21121 Java excel
    直接上代码，一看就懂，利用的是jxl： import java.io.File; import java.io.IOException; import jxl.Cell; import jxl.Sheet; import jxl.Workbook; import jxl.read.biff.BiffException; import jxl.write.Label; import
  • web报表工具finereport常用函数的用法总结（数组函数） 老A不折腾 finereportweb报表函数总结
    ADD2ARRAY ADDARRAY(array,insertArray, start):在数组第start个位置插入insertArray中的所有元素，再返回该数组。 示例： ADDARRAY([3,4, 1, 5, 7], [23, 43, 22], 3)返回[3, 4, 23, 43, 22, 1, 5, 7]. ADDARRAY([3,4, 1, 5, 7], "测试&q
  • 游戏服务器网络带宽负载计算 墙头上一根草 服务器
    家庭所安装的4M，8M宽带。其中M是指，Mbits/S 其中要提前说明的是： 8bits = 1Byte 即8位等于1字节。我们硬盘大小50G。意思是50*1024M字节，约为 50000多字节。但是网宽是以“位”为单位的，所以，8Mbits就是1M字节。是容积体积的单位。 8Mbits/s后面的S是秒。8Mbits/s意思是 每秒8M位，即每秒1M字节。 我是在计算我们网络流量时想到的
  • 我的spring学习笔记2-IoC（反向控制 依赖注入） aijuans Spring 3 系列
    IoC（反向控制 依赖注入）这是Spring提出来了，这也是Spring一大特色。这里我不用多说，我们看Spring教程就可以了解。当然我们不用Spring也可以用IoC，下面我将介绍不用Spring的IoC。 IoC不是框架，她是java的技术，如今大多数轻量级的容器都会用到IoC技术。这里我就用一个例子来说明： 如：程序中有 Mysql.calss 、Oracle.class 、SqlSe
  • 高性能mysql 之 选择存储引擎(一) annan211 mysqlInnoDBMySQL引擎存储引擎
    1 没有特殊情况，应尽可能使用InnoDB存储引擎。   原因：InnoDB 和 MYIsAM 是mysql 最常用、使用最普遍的存储引擎。其中InnoDB是最重要、最广泛的存储引擎。她   被设计用来处理大量的短期事务。短期事务大部分情况下是正常提交的，很少有回滚的情况。InnoDB的性能和自动崩溃   恢复特性使得她在非事务型存储的需求中也非常流行，除非有非常
  • UDP网络编程 百合不是茶 UDP编程局域网组播
      UDP是基于无连接的,不可靠的传输   与TCP/IP相反       UDP实现私聊,发送方式客户端,接受方式服务器 package netUDP_sc; import java.net.DatagramPacket; import java.net.DatagramSocket; import java.net.Ine
  • JQuery对象的val()方法执行结果分析 bijian1013 JavaScriptjsjquery
            JavaScript中，如果id对应的标签不存在（同理JAVA中，如果对象不存在），则调用它的方法会报错或抛异常。在实际开发中，发现JQuery在id对应的标签不存在时，调其val()方法不会报错，结果是undefined。        
  • http请求测试实例（采用json-lib解析） bijian1013 jsonhttp
            由于fastjson只支持JDK1.5版本，因些对于JDK1.4的项目，可以采用json-lib来解析JSON数据。如下是http请求的另外一种写法，仅供参考。 package com; import java.util.HashMap; import java.util.Map; import
  • 【RPC框架Hessian四】Hessian与Spring集成 bit1129 hessian
    在【RPC框架Hessian二】Hessian 对象序列化和反序列化一文中介绍了基于Hessian的RPC服务的实现步骤，在那里使用Hessian提供的API完成基于Hessian的RPC服务开发和客户端调用，本文使用Spring对Hessian的集成来实现Hessian的RPC调用。   定义模型、接口和服务器端代码 |---Model    &nb
  • 【Mahout三】基于Mahout CBayes算法的20newsgroup流程分析 bit1129 Mahout
    1.Mahout环境搭建  1.下载Mahout http://mirror.bit.edu.cn/apache/mahout/0.10.0/mahout-distribution-0.10.0.tar.gz    2.解压Mahout  3. 配置环境变量 vim /etc/profile export HADOOP_HOME=/home
  • nginx负载tomcat遇非80时的转发问题 ronin47
    　　nginx负载后端容器是tomcat（其它容器如WAS,JBOSS暂没发现这个问题）非８０端口，遇到跳转异常问题。解决的思路是：$host:port        详细如下： 　　 该问题是最先发现的，由于之前对nginx不是特别的熟悉所以该问题是个入门级别的： ? 1 2 3 4 5
  • java-17-在一个字符串中找到第一个只出现一次的字符 bylijinnan java
    public class FirstShowOnlyOnceElement { /**Q17.在一个字符串中找到第一个只出现一次的字符。如输入abaccdeff，则输出b * 1.int[] count:count[i]表示i对应字符出现的次数 * 2.将26个英文字母映射：a-z <--> 0-25 * 3.假设全部字母都是小写 */ pu
  • mongoDB 复制集 开窍的石头 mongodb
    mongo的复制集就像mysql的主从数据库，当你往其中的主复制集(primary)写数据的时候，副复制集(secondary)会自动同步主复制集(Primary)的数据,当主复制集挂掉以后其中的一个副复制集会自动成为主复制集。提供服务器的可用性。和防止当机问题             mo
  • [宇宙与天文]宇宙时代的经济学 comsci 经济
        宇宙尺度的交通工具一般都体型巨大，造价高昂。。。。。      在宇宙中进行航行，近程采用反作用力类型的发动机，需要消耗少量矿石燃料，中远程航行要采用量子或者聚变反应堆发动机，进行超空间跳跃，要消耗大量高纯度水晶体能源      以目前地球上国家的经济发展水平来讲，
  • Git忽略文件 Cwind git
         有很多文件不必使用git管理。例如Eclipse或其他IDE生成的项目文件，编译生成的各种目标或临时文件等。使用git status时，会在Untracked files里面看到这些文件列表，在一次需要添加的文件比较多时（使用git add . / git add -u），会把这些所有的未跟踪文件添加进索引。 ==== ==== ==== 一些牢骚
  • MySQL连接数据库的必须配置 dashuaifu mysql连接数据库配置
    MySQL连接数据库的必须配置   1.driverClass：com.mysql.jdbc.Driver   2.jdbcUrl：jdbc:mysql://localhost:3306/dbname   3.user：username   4.password：password   其中1是驱动名；2是url，这里的‘dbna
  • 一生要养成的60个习惯 dcj3sjt126com 习惯
    一生要养成的60个习惯 第1篇 让你更受大家欢迎的习惯 1 守时，不准时赴约,让别人等,会失去很多机会。 如何做到： ①该起床时就起床， ②养成任何事情都提前15分钟的习惯。 ③带本可以随时阅读的书，如果早了就拿出来读读。 ④有条理，生活没条理最容易耽误时间。 ⑤提前计划：将重要和不重要的事情岔开。 ⑥今天就准备好明天要穿的衣服。 ⑦按时睡觉，这会让按时起床更容易。 2 注重
  • [介绍]Yii 是什么 dcj3sjt126com PHPyii2
    Yii 是一个高性能，基于组件的 PHP 框架，用于快速开发现代 Web 应用程序。名字 Yii （读作 易）在中文里有“极致简单与不断演变”两重含义，也可看作 Yes It Is! 的缩写。 Yii 最适合做什么？ Yii 是一个通用的 Web 编程框架，即可以用于开发各种用 PHP 构建的 Web 应用。因为基于组件的框架结构和设计精巧的缓存支持，它特别适合开发大型应
  • Linux SSH常用总结 eksliang linux sshSSHD
    转载请出自出处：http://eksliang.iteye.com/blog/2186931 一、连接到远程主机   格式： ssh name@remoteserver 例如： ssh [email protected]   二、连接到远程主机指定的端口   格式： ssh name@remoteserver -p 22 例如： ssh i
  • 快速上传头像到服务端工具类FaceUtil gundumw100 android
    快速迭代用 import java.io.DataOutputStream; import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io.FileOutputStream; import java.io.IOExceptio
  • jQuery入门之怎么使用 ini JavaScripthtmljqueryWebcss
    jQuery的强大我何问起（个人主页：hovertree.com）就不用多说了，那么怎么使用jQuery呢？   首先，下载jquery。下载地址：http://hovertree.com/hvtart/bjae/b8627323101a4994.htm，一个是压缩版本，一个是未压缩版本，如果在开发测试阶段，可以使用未压缩版本，实际应用一般使用压缩版本(min)。然后就在页面上引用。
  • 带filter的hbase查询优化 kane_xie 查询优化hbaseRandomRowFilter
    问题描述 hbase scan数据缓慢，server端出现LeaseException。hbase写入缓慢。   问题原因 直接原因是： hbase client端每次和regionserver交互的时候，都会在服务器端生成一个Lease,Lease的有效期由参数hbase.regionserver.lease.period确定。如果hbase scan需
  • java设计模式-单例模式 men4661273 java单例枚举反射IOC
             单例模式1，饿汉模式 //饿汉式单例类.在类初始化时，已经自行实例化 public class Singleton1 { //私有的默认构造函数 private Singleton1() {} //已经自行实例化 private static final Singleton1 singl
  • mongodb 查询某一天所有信息的3种方法，根据日期查询 qiaolevip 每天进步一点点学习永无止境mongodb纵观千象
    // mongodb的查询真让人难以琢磨，就查询单天信息，都需要花费一番功夫才行。 // 第一种方式： coll.aggregate([ {$project:{sendDate: {$substr: ['$sendTime', 0, 10]}, sendTime: 1, content:1}}, {$match:{sendDate: '2015-
  • 二维数组转换成JSON tangqi609567707 java二维数组json
    原文出处：http://blog.csdn.net/springsen/article/details/7833596 public class Demo {     public static void main(String[] args) {        String[][] blogL
  • erlang supervisor wudixiaotie erlang
    定义supervisor时，如果是监控celuesimple_one_for_one则删除children的时候就用supervisor:terminate_child (SupModuleName, ChildPid)，如果shutdown策略选择的是brutal_kill，那么supervisor会调用exit(ChildPid, kill)，这样的话如果Child的behavior是gen_
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他