clone:range对象的克隆;

<body>
<p id="p">这是一段文字</p>
<button onclick="btn()">克隆</button>
<script>
function btn() {
var p=document.getElementById("p");
var rangeObj=document.createRange();
rangeObj.selectNodeContents(p)
var clone=rangeObj.cloneRange();
alert(clone.toString());
}
</script>
</body>
<body>
<div id="div">这是要克隆的文字内容<br/></div>
<button onclick="btn()">克隆</button>
<script>
function btn() {
var div=document.getElementById("div");
var rangeObj=document.createRange();
rangeObj.selectNodeContents(div);
var clone=rangeObj.cloneContents();
//appendChild() 方法向节点添加最后一个子节点。
div.appendChild(clone);
}
</script>
</body>

[H5]range对象的clone方法的更多相关文章

  1. [H5]range对象的createRange方法

    range对象的extractContents()方法: extractContents() 方法删除文档内容,并以 DocumentFragment 对象的形式返回它; DocumentFragme ...

  2. [H5]range对象之selectNode等方法

    关于range对象的selectNodeContents.selectNode.deleteContents方法 示例代码如下: <!DOCTYPE html> <html lang ...

  3. [H5]range对象的setStart/setEnd方法

    1.setStart:表示某个节点的range对象的起点位置;2.setEnd:表示某个节点的range对象的结束位置; 示例如下:<body> <div id="div& ...

  4. getSelection、range 对象属性,方法理解,解释

    网上转了一圈发现没有selection方面的解释,自己捣鼓下 以这段文字为例子.. <p><b>法国国营铁路公司(SNCF)20日承认,</b>新订购的2000列火 ...

  5. java Object对象的clone方法

    参考copy链接:http://blog.csdn.net/bigconvience/article/details/25025561 在看原型模式,发现要用到clone这个方法,以前和朋友聊过,没怎 ...

  6. js object对象赋值bug和对象复制clone方法

    最近在写程序的时候发现,如果新建一个object对象objb,初始化值为obja,如果改变了objb对象的字段值,那么obja也会随之改变,看来对象赋值传递的是一个引用. 代码重现: <scri ...

  7. Effective java笔记(二),所有对象的通用方法

    Object类的所有非final方法(equals.hashCode.toString.clone.finalize)都要遵守通用约定(general contract),否则其它依赖于这些约定的类( ...

  8. HTML5中的Range对象的研究

    一:Range对象的概念 Range对象代表页面上的一段连续区域,通过Range对象,可以获取或修改页面上的任何区域,可以通过如下创建一个空的Range对象,如下: var  range = docu ...

  9. 详解Java中的clone方法:原型模式

    转:http://developer.51cto.com/art/201506/478985.htm clone顾名思义就是复制, 在Java语言中, clone方法被对象调用,所以会复制对象.所谓的 ...

随机推荐

  1. (转)基于 Token 的身份验证

    原文:https://ninghao.net/blog/2834 最近了解下基于 Token 的身份验证,跟大伙分享下.很多大型网站也都在用,比如 Facebook,Twitter,Google+,G ...

  2. 遍历数组按学号找人,若找到则输出信息,否则输出"查无此人"

    //建立一个类类型的数组,并向这个数组内添加学生信息,包括姓名和年龄等 **********************学生类************************** package prac ...

  3. HDU 5616 Jam's balance(DP)

    题目网址:http://acm.hdu.edu.cn/showproblem.php?pid=5616 题目: Jam's balance Time Limit: 2000/1000 MS (Java ...

  4. Android - 读取JSON文件数据

    Android读取JSON文件数据 JSON - JavaScript Object Notation 是一种存储和交换文本信息的语法. JSON对象在花括号中书写.用逗号来分隔值. JSON数组在方 ...

  5. linux基础(五)

    一.linux网络原理及基础设置 ifconfig 命令:显示所有正在启动的网卡的详细信息或设定系统中网卡的IP地址. [root@bogon ~]# ifconfig ens33: flags=41 ...

  6. Windows远程linux服务器执行shell命令

    一.前言 借用百度百科关于putty的描述:PuTTY是一个Telnet.SSH.rlogin.纯TCP以及串行接口连接软件.较早的版本仅支持Windows平台,在最近的版本中开始支持各类Unix平台 ...

  7. 支持多个版本的ASP.NET Core Web API

    基本配置及说明 版本控制有助于及时推出功能,而不会破坏现有系统. 它还可以帮助为选定的客户提供额外的功能. API版本可以通过不同的方式完成,例如在URL中添加版本或通过自定义标头和通过Accept- ...

  8. android studio生成junitLibs

    apply plugin: 'com.android.application'android { compileSdkVersion 24 buildToolsVersion "25.0.0 ...

  9. 【设计模式】Bridge模式(桥接模式)

    最近的一次面试中,被问到桥接模式,以前呢并没有很仔细的研究过这个设计模式,借此机会剖析一下. 先给出自己对这个模式理解后的源码: interface A{ void methodA(); } inte ...

  10. 使用maven搭建环境

    今天第一次用maven创建springmvc工程,下载配置都很成功,但用命令行创建项目时遇到一些问题: 1.命令行显示命令不为内部或外部命令: 解决方法:使用管理员模式打开命令行 2. 显示到如下图所 ...