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. Vue中axios的使用技巧配置项详解

    使用axios首先要下载axios模块包 npm install axios --save 其次需要在使用的文件中引入 import axios from 'axios' 一.调用axios常见两种方 ...

  2. spring-data-redis使用哨兵配置一主多从

    redis自带的哨兵确实简化了高可用性的配置,使用起来也比较简单. 首先是spring-redis-sentinel.xml(文件名可以随意命名)配置文件: <?xml version=&quo ...

  3. Java NIO之套接字通道

    1.简介 前面一篇文章讲了文件通道,本文继续来说说另一种类型的通道 -- 套接字通道.在展开说明之前,咱们先来聊聊套接字的由来.套接字即 socket,最早由伯克利大学的研究人员开发,所以经常被称为B ...

  4. 定位bug的姿势对吗？

    举个例子来说明 WEB页面上数据显示错误,本来应该显示38,  结果显示35,这个时候你怎么去定位这个问题出在哪里? 1.通过fiddler抓包工具(或者其他抓包工具), 分析接口返回的数据是35还是 ...

  5. img之间的间隙问题

    前言:关于基线(base line),中线(middle line),行高(line height)的了解还是比较浅的,所以引用前辈的成果,稍带解释下 1)行高:两行文字之间"基线" ...

  6. 福州大学W班-团队作业-随堂小测（同学录）成绩

    作业链接 https://edu.cnblogs.com/campus/fzu/FZUSoftwareEngineering1715W/homework/1246 作业要求 1.题目 即编写一个能够记 ...

  7. 201621123062《java程序设计》第11周作业总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多线程相关内容. 思维导图: 2. 书面作业 本次PTA作业题集多线程 2.1. 源代码阅读:多线程程序BounceThread 2 ...

  8. Flask 学习 八 用户角色

    角色在数据库中表示 app/models.py class Role(db.Model): __tablename__='roles' id = db.Column(db.Integer,primar ...

  9. 【iOS】OC-AFNetworking 2.0 跟踪文件上传进度

    我是较新的 AFNetworking 2.0.使用下面的代码片段,我已经能够成功地将一张照片上传到我的 url.我想要跟踪的增量上载进度,但我找不到这样做 2.0 版的示例.我的应用程序是 iOS 7 ...

  10. codeforces 830 B Cards Sorting

    B. Cards Sorting  http://codeforces.com/problemset/problem/830/B Vasily has a deck of cards consisti ...