range对象的surroundContents方法怎么用？

Question

上边这里写错了，应该是，不知道什么导致错误 range.surroundContents(span);

Answer 1

好像是说边界不符合要求, 不能夸标签的吧
The boundary-points of a range does not meet specific requirements.[code=JScript][/codevar p1 = document.getElementById("p1");
    var helloNode = p1.firstChild.firstChild;
    var worldNode = p1.lastChild;    var range = document.createRange();
    range.setStart(helloNode, 0);
    range.setEnd(helloNode, 5);    var span = document.createElement("span");
    span.style.color = "yellow";    alert(1);    range.surroundContents(span);  //这里出错;    alert(2);]

Answer 2

我也看到这一块了，但我知道
把
range.surroundContents(f);
改成：
range.surroundContents(span);但为什么没有效果呢？    

Answer 3

range.setStart(helloNode, 2);
range.setEnd(worldNode, 3);surroundContents方法要求不能部分选择节点，也就是说setStart和setEnd方法的第一个参数要一致才可以，改成range.setEnd(helloNode, 3);就有效果了

Answer 4

surroundContents()
<p id="p1"><b>Hello</b> World</p>
<script>
    var oP1 = document.getElementById("p1");
    var oHello = oP1.firstChild.firstChild;
    var oWorld = oP1.lastChild;
    var oRange = document.createRange();
    var oSpan = document.createElement("span");
    oRange.setStart(oHello, 2);
    oRange.setEnd(oWorld, 3);
    oRange.surroundContents(oSpan);
</script>
因为部分地选择了“<b>oHello</b>”，所以会抛出“BAD_BOUNDARYPOINTS_ERR”错误（虽然会自动添加“<b>”让元素“well-formed”，仍然会报错）。下面的代码将能够正常运行：
<p id="p1"><b>Hello</b> World</p>
<script>
    var oP1 = document.getElementById("p1")
    var oRange = document.createRange();
    var oSpan = document.createElement("span");
    oRange.setStart(oP1, 0);
    oRange.setEnd(oP1.lastChild, 3);
    oRange.surroundContents(oSpan);
</script>
运行后，HTML将变成
<p id="p1"><span><b>Hello</b>  Wo</span>rld</p>