Range对象有几个特别难理解的属性,这里学习总结下

Range.startOffset:返回一个表示 Range 起点在 startContainer 中的位置的数字。此属性的值与Range.startContainer属性相关,索引从0开始

Range.endOffset:返回一个表示 Range 终点在 endContainer 中的位置的数字。此属性的值与Range.endContainer属性相关,索引从一开始

Range.startOffset 和 range.endOffset的值有两种情况

1.选择的Node对象是 Text,Comment 或 CDATASection,则这个值是 Range.startContainer属性对应的Node节点的文本偏移值,方向从左往右,索引从0开始,包含当前偏移值指的对应文本

2.选择的Node对象是 Element,endOffset和startOffset弄不明白,莫名奇妙的值,通过range.selectNode进行选择节点,导致的endOffset和startOffset的值挺混乱的,找不到规律

Javascript Range对象的学习的更多相关文章

  1. JavaScript【对象的学习】

    JavaScript对象的了解 1.js的String对象创建String对象:var str = "abc";方法和属性(参照W3C文档详细学习)属性 length:字符串的长度 ...

  2. 前端学习(十七):JavaScript常用对象

    进击のpython ***** 前端学习--JavaScript常用对象 JavaScript中的所有事物都是对象:字符串.数字.数组.日期,等等 在JavaScript中,对象是拥有属性和方法的数据 ...

  3. html5学习笔记5--API Range对象(二)

    Range对象之cloneRange和cloneContents 代码效果如下 首次点击“选择内容“按钮提示如下 接着会显示 最后显示 以下为整个代码 <!DOCTYPE html> &l ...

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

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

  5. 关于JavaScript中对象的继承实现的学习总结

    一.原型链 JavaScript 中原型链是实现继承的主要方法.其主要的思想是利用原型让一个引用类型继承另一个引用类型的属性和方法.实现原型链有一种基本模式,其代码如下. function Super ...

  6. [html5] 学习笔记- 编辑API之Range对象(二)

    本节继续介绍range对象的方法,包括cloneRange,cloneContents,extraContents,createContextual,createContextual-Fragment ...

  7. [html5] 学习笔记-编辑 API 之 Range 对象(一)

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

  8. 编辑器开发之 Range 范围对象的学习

    写在前面: 网上有各种富文本编辑器,微博分享等操作,这些功能非常实用,他们就是使用 range,selection 对象来实现的,这两个对象偏冷门,不涉及编辑器一般用不到,range 对象是对选区的操 ...

  9. web前端学习(四)JavaScript学习笔记部分(8)-- JavaScript 浏览器对象

    1.window对象 1.1.window对象: window对象是BOM的核心,window对象指当前的浏览器窗口 所有javaScript全局对象.函数以及变量均自动生成为window对象的成员 ...

随机推荐

  1. 第一次打开pycharm运行python文件报错”No Python interpreter selected“问题的解决办法

    前面没有细讲,这里细述一下安装pycharm后,第一次打开pycharm运行python文件报错"No Python interpreter selected"问题的解决办法. 出 ...

  2. 缓冲区(buffer)与缓存(cache) 缓冲:缓解冲击,缓存:临时存储

    缓存与缓冲区 简要概述 缓存(cache):故名思意就是临时存储一下数据的存储器,其他设备可能等下还用的到数据.缓存区可以用来做缓冲区 缓冲区(Buffer):故名意思就是解决设备之间速度不匹配的问题 ...

  3. Linux命令(ping-telnet-netstat-curl-ps)

    转至:https://www.jianshu.com/p/577bbd15a6f8 1.ping命令 ping命令用来测试主机之间网络的连通性.执行ping指令会使用ICMP传输协议,发出要求回应的信 ...

  4. k8s全方位监控中-常用rules配置

    [root@VM_0_48_centos prometheus]# cat alertmanager-configmap.yaml apiVersion: v1 kind: ConfigMap met ...

  5. 前端js webuploader上传(导入)excel文件

    项目开发中用到导入(上传)Excel文件 我使用的是百度的webuploader: 1:下载:http://fex.baidu.com/webuploader/(官方下载/示例) 2:使用Web Up ...

  6. Windows原理深入学习系列-访问控制列表-关于安全描述符的补充

    这是[信安成长计划]的第 20 篇文章 0x00 目录 0x01 安全描述符的结构 0x02 两个结构的不同点 0x03 真正的查询方案 0x04 参考文章 0x01 安全描述符的结构 在上一篇文章中 ...

  7. hadoop分布式集群部署①

     Linux系统的安装和配置.(在VM虚拟机上) 一:安装虚拟机VMware Workstation 14 Pro 以上,虚拟机软件安装完成. 二:创建虚拟机. 三:安装CentOS系统 (1)上面步 ...

  8. 编写第一个GET、POST接口[renren-fast框架系列(1)]

    配置好 renren-fast 脚手架,学习完 Spring MVC 架构后,我需要具体调试 renren-fast 的接口,比如要新增某个接口. 什么是前后端分离 运行 renren-fast 项目 ...

  9. tp 5 框架 ajax软删除,回收站,数据恢复

    //HTML代码: <td> <span onclick="del({$v.id})">删除</span> </td> //ajax ...

  10. Applied-Social-Network-Analysis-in-Python 相关笔记4

    模型数据越多,Average系数就越小. perferential attachment model 有比较小的平均路径长度,但有着小的cc. rewire:重新连接 如果仅看这个共同的邻居数的话,数 ...