首页 > 代码库 > select + range + insertNode+offset

select + range + insertNode+offset

2024-08-21 20:44:12   220人阅读

self. cmd.range.selectNodeContents(p[0])   建立选区
self.cmd.select()   选中选区
self.cmd.selection([forceRest])  根据当前选中状态重置range对象，forceRest默认值为false，值为true时如果当前没有选中信息，自动选择文档(body编辑区域最后节点之后)的最后位置
insertNode是在当前选区之前插入的

理解这个range关键都在红色的分界线
up 提高一个range

<p>
        <strong id="nstrong"><span>123</span>abc</strong>def
    </p>

        
var range = mainbody_editor.cmd.range;
      var len = doc.getElementById("nstrong").childNodes;  [span, text]
     var up = range.up();

offset就是从初始位置到分界线有多少个节点

12|345|6
红色的竖线是分界线，startoffset 位置前头有2个节点所以是2，endoffset前头有5个节点所以是5
 <strong id="nstrong">|<span>123</span>|abc</strong>def
startoffset就是0  endoffset就是1
 
选区部分 startContainer text   startoffset 0   endContainer text   endffset 3

startContainer的startoffset在开始处，endContainer的endffset在结尾处
up之后  就是找到container的container
选区部分 startContainer span    startoffset 0   endContainer strong   startoffset 2

enlarge之后就是p，相当于找到公共的父节点

在文本节点内部 up enlarge是不变的,对于选区是元素节点是变化的
123
 
setStartAfter 是在一个节点的结束位置之后 比如 text | 这个时候偏移量是1，因为前面只有一个text节点

select + range + insertNode+offset


联系
我们