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

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div id="div" style="background-color:rosybrown;width:500px;height:200px;">这里有文字</div>

    <input type="button" onclick="deleteContent(true)" value="删除内容">

    <input type="button" onclick="deleteContent(false)" value="删除元素">

    <script>

        function deleteContent(test) {

            var div=document.getElementById("div");

            var range=document.createRange();

            if (test){

                range.selectNodeContents(div);

                range.deleteContents();

            }else{

                range.selectNode(div);

                range.deleteContents();

            }

        }

    </script>

</body>

</html>

[H5]range对象之selectNode等方法的更多相关文章

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

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

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

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

  3. [H5]range对象的clone方法

    clone:range对象的克隆; <body> <p id="p">这是一段文字</p> <button onclick="b ...

  4. html5学习笔记4--API Range对象(一)

    Range对象基本用法 效果图如下(在谷歌浏览器下的展示)

  5. HTML5中的Range对象的研究

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

  6. HTML5 编辑 API 之 Range 对象（一）

     一.Range 对象基本概念 通过使用 Range 对象所提供的方法实现一个鼠标选取内容,通过点击按钮打印出选中内容,当然注意在不同的浏览器下可选中的内容数量是不同的. <!DOCTYPE h ...

  7. HTML5中的Range对象的研究（转载）

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

  8. [html5] 学习笔记-编辑 API 之 Range 对象（一）

    1.Range对象的基本概念 一个Range对象代表页面上的一段连续区域,通过Range对象,可以获取或修改网页上的任何区域. <!DOCTYPE html> <html> & ...

  9. 理解HTML5中Range对象

    1.理解Range对象    重新来学习下HTML5中的Range对象和Selection对象,最近在维护富文本编辑器,感觉这方面的知识点很有用,所以趁着周末多学习下~  什么是Range对象? 在H ...

随机推荐

  1. BufferedWriterTest

    public class BufferedWriterTest { public static void main(String[] args) { try { //创建一个FileWriter 对象 ...

  2. js中变量的连续赋值

    今天遇到了一个连续赋值的经典案例,网友们给出的答案也是五花八门,看起来有些繁琐,我也来说说自己的看法. 下面就是这个经典案例: var a = {n: 1}: var b = a; a.x = a = ...

  3. 【WeX5学习】 后端服务之访问数据库表

    WeX5是跨段移动开发框架,将H5的标签封装成组件,实现可视化.组件化快速开发.实现一次开发,多端(iOS.安卓和微信)运行.WeX5的IDE基于Eclipse,提供了一个完全可视化.组件化.拖拽式开 ...

  4. JavaScript中的设计模式：策略模式

    无论学习前端还是后端设计模式是作为一名程序员不可缺少的知识,就像下底传中对于一个边锋来说. 一.策略模式 策略模式给人的第一感觉就是在代码里面消除了很多if-else分支语句,比如一个求员工奖金的程序 ...

  5. 基于jenkins搭建一个持续集成服务器

    1 引言 1.1 编写目的 指导质量管理部,业务测试组同事进行Jenkins环境部署,通过Jenkins解决测试环境不可控,开发测试环境不一致等问题. 1.2 使用对象 质量管理部.基础研发部,集成部 ...

  6. serv-u 多域配置

    serv-U后,默认情况下可以通过在浏览器中输入http://IP 的方式登录到serv-u ftp 服务器控制台,也就是说serv-u在80端口监听,这样,如果想配置多个域或者是想在自己电脑上安装A ...

  7. DL4NLP —— seq2seq+attention机制的应用：文档自动摘要（Automatic Text Summarization）

    两周以前读了些文档自动摘要的论文,并针对其中两篇( [2] 和 [3] )做了presentation.下面把相关内容简单整理一下. 文本自动摘要(Automatic Text Summarizati ...

  8. GetConsoleTitle 函数--获取控制台窗口标题

    GetConsoleTitle函数 来源:https://msdn.microsoft.com/en-us/library/windows/desktop/ms683174(v=vs.85).aspx ...

  9. sudo 和su

    场景:在服务器上进行操作的时候通常不适用root用户,但是有时候执行某一些操作需要使用root权限... 1 su命令 使用su命令来切换用户,su是switch user切换用户的缩写. 可以是从普 ...

  10. 【Mysql】MySQL与Oracle的大小写问题

    转载来源:http://aofengblog.blog.163.com/blog/static/63170212010101065030136/ MySQL与Oracle在大小写处理上的区别: 1MY ...