JavaScript 克隆

本次学习内容：

克隆:只克隆标签和属性，不克隆文本。

克隆的功能，如果不添加使用Ture，就只会克隆标签和属性，不会克隆文本。

克隆的参数全部是节点对象,不能是字符串

<!DOCTYPE html>

<html lang="en">

<head>

	<meta charset="UTF-8">

	<title>克隆标签属性和文本</title>

</head>

<body>

	<div>

		<a href="https://www.sogou.com/" title="搜狗网站">搜狗</a>

	</div>

	<button>点击</button>

</body>

<script>

/*

	克隆的对象.cloneNode(true):克隆标签属性和文本

*/

	//获取对象

	var btn = document.querySelector('button');

	var a = document.querySelector('a');

	var div = document.querySelector('div');

	//按钮单击事件

	btn.onclick = function(){

		//克隆:只克隆标签和属性，不克隆文本。

		//var aClone = a.cloneNode();

		//console.log(aClone);

		//常用的克隆方式:完整克隆：克隆标签、属性、文本。

		var aClone2 = a.cloneNode(true);

		//console.log(aClone2);

		div.appendChild(aClone2);

	}

//注意:上述方法中的参数全部是节点对象,不能是字符串

</script>

</html>

　　

JavaScript 克隆的更多相关文章

  1. javascript 克隆对象/数组的方法 clone()

      1 11 javascript 克隆对象/数组的方法 clone() 1 demo: code: 1 var Obj; 2 let clone = (Obj) => { 3 var buf; ...

  2. JavaScript 克隆对象

    function clone(origin) { return Object.assign({}, origin); } let aClone = { ...a }; // 等同于 let aClon ...

  3. javascript克隆一个对象

    /* * 克隆一个对象 */ com.ty.repairtech.JsonOperation.clone = function(obj) { // Handle the 3 simple types, ...

  4. JavaScript克隆数组

    /** * 克隆数组 * @param arr */ function cloneArray(arr){ var _arr=[]; for(var i=0;i<arr.length;i++){ ...

  5. js深入研究之克隆，属性，数组，对象，函数

    代码 <script type="text/javascript"> /* 克隆原型得到对象 */ function clone(object) { function ...

  6. 12.06 JavaScript

    任务 掌握JavaScript基础知识,能够使用JavaScript编写一些复杂度不大的交互功能. 任务: JavaScript基础 做完任务一的时候深深地感觉到自己的基础非常的薄弱,在这里再次感谢一 ...

  7. DOM操作-克隆元素

    代码: ———————————————————————————— <script type="text/javascript">            //克隆元素   ...

  8. a个人经验总结2

    金额 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8& ...

  9. jQuery基础修炼圣典—DOM篇（一）

    一.DOM节点的创建 1.创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作.但实际上一般开发者都习惯性的先定义好HTML结构,但这样就非常不灵活了. ...

随机推荐

  1. GEETEST极验召集互联网大佬齐聚光谷，共同探讨交互安全问题

    全球互联网技术在飞速发展的同时,网络安全事件也随之频发.除了直接带来经济损失的网络恶意攻击之外,企业在多个方面也遭受着不同程度的网络恶意攻击,包括品牌形象.管理时间.企业竞争力.客户成交量.用户行为等 ...

  2. 分享基于Qt5开发的一款故障波形模拟软件

    背景介绍 这是一款采用Qt5编写的用于生成故障模拟波形的软件.生成的波形数据用于下发到终端机器生成对应的故障类型,用于培训相关设备维护人员的故障排查技能.因此,在这款软件中实现了故障方案管理.故障波形 ...

  3. vue实现懒加载的几种方法

    vue实现惰性加载是基于: 1.ES6的异步机制 components: { comp: (resolve, reject) => {} } 2. webpack的代码分割功能 require. ...

  4. 笔记：创建Jersey REST 服务，基于Maven

    基于Java SE 形式的REST服务 创建项目 我们首选使用 archetypeGroupId 为 org.glassfish.jersey.archetypes 的原型,archetypeArti ...

  5. canvas---HTML5新特性

    画圆及填充文字<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <ti ...

  6. ASP.NET MVC编程——缓存

    Web缓存分为服务端缓存和客户端缓存. 1 服务端缓存 1.1请求域内的缓存:HttpContext.Items 类型: HttpContext.Items的类型为IDictionary,且键和值都是 ...

  7. 【Flask】 Jinja2模板语言

    Jinja2 Jinja2是Python Web编程中的主流模板语言.因为flask是基于Jinja2和Werkzeug发展而来,在安装flask的时候jinja2自动就被装在上面了. 之前提到了很多 ...

  8. 不可思议的纯CSS导航栏下划线跟随效果

    先上张图,如何使用纯 CSS 制作如下效果? 在继续阅读下文之前,你可以先缓一缓.尝试思考一下上面的效果或者动手尝试一下,不借助 JS ,能否巧妙的实现上述效果. OK,继续.这个效果是我在业务开发的 ...

  9. [poj3687]Labeling Balls_拓扑排序

    Labeling Balls poj-3687 题目大意:给出一些球之间的大小关系,求在满足这样的关系下,编号小的尽量比编号大的球的方案. 注释:1<=N(球的个数)<=200,1< ...

  10. RedHat/Fedora/Centos 下bash 自动补全命令

    本文转自:运维生存时间:http://www.ttlsa.com/linux/rhel- ... matically-function/ linuser  :http://www.linuser.co ...