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. sql注入之报错注入and boolean注入

    1.sql注入之报错注入 正常传参,返回页面正常: 加入'  返回页面报错,出现"zhangsan"' 报错注入使用的函数 在这里我们使用 select updatexml(1,c ...

  2. windev的弹窗详情页滚动条实现方法以及弹窗尺寸规划

    按照企业信息系统的设计习惯,我们一般将信息以列表的方式在主窗口展现,同时设置需要展现的字段,一些系统会将这个窗口称为总表页.列表页等.而信息的编辑或完整信息的查询,一般通过一个弹窗来实现,一些系统会将 ...

  3. uniapp vue3 $on/$once/$off 的替代方案

    仅作参考 仅作参考 仅作参考 并且只支持页面生命周期使用 不支持组件 不支持页面函数方法 下面说了思路需要的话自己添加 今天用到 $once 时发现报错了,原理是vue3移除了该api.我一开始想的是 ...

  4. linux服务器随机10字符病毒/libudev4.so病毒清理的过程

    故障表现:某天晚上突然收到某项目一台web服务器CPU报警,SSH连接困难卡顿,登陆后发现CPU使用率飙升到700%,第一感觉是被黑了,来事了. 故障处理: 1.登陆上后发现有好多莫名的命令(who/ ...

  5. C语言中puts()和printf()区别

    puts的功能更加单一,只能输出字符串:printf的功能更加广,可以格式化数据,输出多种类型的数据. puts()函数用来向标准输出设备(屏幕)写字符串并换行. 调用方式为puts(string): ...

  6. 【C#基础概念】字面量 literal

    一.字面量定义 在计算机科学中,字面量(literal)是用于表达源代码中一个固定值的表示法(notation).几乎所有计算机编程语言都具有对基本值的字面量表示,诸如:整数.浮点数以及字符串:而有很 ...

  7. 远程连接DB2

    今天需要和别的公司业务系统进行对接,刚好他们使用的数据库是DB2,需求场景是这样的:我们需要往DB2里面写数据.查看数据,修改数据,统计数据.我们的源库是SQL SEVER,目标库是DB2;需求已经告 ...

  8. Could not load file or assembly 'System.Windows.Forms, Version=6.0.2.0, Culture=neutral, PublicKeyToken=b77a5c561934e089

    项目升级后提示错误 System.IO.FileNotFoundException: Could not load file or assembly 'System.Windows.Forms, Ve ...

  9. Element-UI tree 组件 点击后高亮显示的样式修改(背景色)

    感觉默认的高亮背景色颜色太浅,修改一下: .el-tree-node:focus > .el-tree-node__content { background-color: #ccc !impor ...

  10. selenium在爬虫中的使用

    一. selenium概述 1.1 定义 Selenium是一个Web的自动化测试工具,最初是为网站自动化测试而开发的,Selenium 可以直接调用浏览器,它支持所有主流的浏览器(包括Phantom ...