var ec = range.endContainer endContainer不是一个引用类型 range是引用类型 range经过改变范围之后 var ec2 =range.endContainer 这个container是一个全新的container 要重新获取, 这两个range内容已经不一样了 回车空格成为了文本节点 <p id="p1"> <b id="b1">Hello</b> World</p> var p = document.getElementById("p1"); var child = p.childNodes; var len = child.length; var a1 = child[0].nodeValue; a1=“↵" var a3 = child[2].nodeValue; a3 = "↵World" 1.selectNode startOffset:选中节点在其父节点的字节点中索引的位置,兼容DOM的浏览器会将空格视为一个文本字节点,这个空格指索引是0的位置如果有空格就将其视为一个文本节点,在选区内部的空格不算,所以 <body> 空格 这时startOffset是1 <p> 空格 <b>hello</b> 空格 world </p> </body> <body><p>...</p></body> 这时startOffset是0 endOffset:startOffset+被选中节点的总数(从start Offset开始到选区结尾的所有子节点个数) commonAncestorContainer :startContainer,endContainer共同的父节点,最深的那一个,同时包含这两个节点的第一个元素 2.selectNodeCOntents <body> <p> 空格 这时startOffset是1 <b>hello</b> 空格 world </p> </body> /*********************示例程序****************************/ window.onload = function(){ var range = document.createRange(), range2 = document.createRange(); var p = document.getElementById("p1"); var child = p.childNodes; var len = child.length; var a1 = child[0].nodeValue; var a3 = child[2].nodeValue; range.selectNode(p); range2.selectNodeContents(p); }; range:startOffset :1,endOffset:2 range2: startOffset:0,endOffset:3 <p id="p1"> <b id="b1">Hello</b> World</p> /*************************************************************/ range.detach(); range = null; 解除对范围的引用,使其从创建范围的文档中分离出来,从而让垃圾回收机制回收其内存 ec = range.endContainer range.deleteContents(); range重置 以上两种情况range 发生了改变,但ec还是未改变之前的ec range发生改变都不会影响ec和sc,因为它们是指向一个dom节点的指针,range的endContainer和startContainer会改变 sc === ec情况下,删除sc,ec并没有被删除 p =K('<P><br /></p>') range.setStartAfter(p[0]).collapse(true); 定位到p的前后任一位置,光标都显示 range.selectNodeContents 会添加‍ 在表单序列化时容易出错 比如‍<br /> br就会被删掉