浏览器范围对象的开始容器属性混淆

Question

我正在浏览范围对象的文档，我对范围对象的开始容器属性有点困惑。我认为开始容器总是一个文本节点，但书中说开始容器也可以代表一个元素。

任何人都可以给我一个例子突出显示，当这将是这种情况？

Answer 1

DOM范围可以表示文档的任何连续部分，其边界可以在文档中的任何位置（包括注释，实体和属性节点内）。它不仅仅用于选择（尽管在最常用的HTML脚本中）。

如果边界容器节点是一个元素，则偏移量是边界之前容器的子节点的数量。例如，查看以下范围（由管道划分）：

<div id="foo"><img src="1.png">|<img src="2.png">|<img src="3.png"></div> 

这里没有任何文本节点。范围开始在div的一个子节点之后，并且结束在两个子节点之后。这个范围可以创建如下：

var div = document.getElementById("foo"); 
var range = document.createRange(); 
range.setStart(div, 1); 
range.setEnd(div, 2);