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. RFC2889MAC地址学习速率——网络测试仪实操

    一.简介 RFC 2889为LAN交换设备的基准测试提供了方法学,它将RFC 2544中为网络互联设备基准测试所定义的方法学扩展到了交换设备,提供了交换机转发性能(Forwarding Perform ...

  2. 哈工大 计算机网络 实验二 可靠数据传输协议（停等协议与GBN协议）

    计算机网络实验代码与文件可见github:计算机网络实验整理 实验名称 可靠数据传输协议(停等协议与GBN协议) 实验目的: 本次实验的主要目的. 理解可靠数据传输的基本原理:掌握停等协议的工作原理: ...

  3. 错误try……except……else……finally 记录错误logging 抛出错误raise

    1.错误处理机制 try--except--finally 格式: try: 可能出错的代码 except xxx1Error as e: 处理1 except xxx2Error as e: 处理2 ...

  4. VS Code 启动占用100%Cpu问题解决办法

    打开VS Code之后,点击文件->首选项->设置 search.followSymlinks

  5. cpolar——安全的内网穿透工具

    什么是cpolar? cpolar是一种安全的内网穿透云服务,它将内网下的本地服务器通过安全隧道暴露至公网,使得公网用户可以正常访问内网服务. 它能用在哪些场景? 微信公众号开发,实时断点调试微信消息 ...

  6. vue项目环境搭建（webpack4从零搭建）--仅个人记录

    一.nodejs环境搭建 首先需要下载node.js(推荐直接官网找最新的版本),下载完成后会自带npm包管理工具,打开cmd命令行界面,输入npm -v .node -v检查node.js与npm是 ...

  7. LeetCode-015-三数之和

    三数之和 题目描述:给你一个包含 n 个整数的数组 nums,判断 nums 中是否存在三个元素 a,b,c ,使得 a + b + c = 0 ?请你找出所有和为 0 且不重复的三元组. 注意:答案 ...

  8. SQL Server内置的HTAP技术

    SQL Server内置的HTAP技术 目录 背景 SQL Server在OLAP上的发展 SQL Server的初代HTAP SQL Server逐渐增强的HTAP SQL Server列存总结 H ...

  9. 矩池云上安装 NVCaffe教程

    使用的是P100,cuda11.1base镜像 创建虚拟环境 conda create -n py36 python=3.6 conda deactivate conda activate py36 ...

  10. 构造方法__construct()与析构方法__destruct() 构造方法：刚出生时婴儿的啼哭 析构方法：老人临终时的遗言

    <?phpclass person{ var $name; var $sex; var $age;//构造方法 function __construct($name, $sex, $age) { ...