H
hantarex
Hi,
please check the following example considering what stated in DOM Level
2 specification, section 2.12. :
"There are two general principles which apply to Ranges under document
mutation: The first is that all Ranges in a document will remain valid
after any mutation operation and the second is that, as much as
possible, all Ranges will select the same portion of the document after
any mutation operation."
[http://www.w3.org/TR/DOM-Level-2-Traversal-Range/ranges.html#Level-2-Range-Mutation]
The behaviour of the following example is supposed to be correct ?
(Testing with Firefox 2)
How to keep the second range to select the same portion of text ?
<html>
<head>
<title>Range test</title>
</head>
<body>
<div id="myText">FooBarBaz</div>
<script type="text/javascript">
myText = document.getElementById('myText').firstChild;
var range1 = document.createRange();
range1.setStart(myText, 3);
range1.setEnd(myText, 6);
var range2 = document.createRange();
range2.setStart(myText, 6);
range2.setEnd(myText, 9);
// as you can see we selected 'bar' and 'baz'
alert('range1: '+range1.toString()+' range2:'+range2.toString());
// let's surround 'bar' with a bold tag....
var newNode1 = document.createElement("b");
range1.surroundContents(newNode1);
// after surrounding range1, range2 doesn't anymore contain 'baz' !!!
alert('range1: '+range1.toString()+' range2:'+range2.toString());
</script>
</body>
</html>
Thanks for any advice.
Alessandro
please check the following example considering what stated in DOM Level
2 specification, section 2.12. :
"There are two general principles which apply to Ranges under document
mutation: The first is that all Ranges in a document will remain valid
after any mutation operation and the second is that, as much as
possible, all Ranges will select the same portion of the document after
any mutation operation."
[http://www.w3.org/TR/DOM-Level-2-Traversal-Range/ranges.html#Level-2-Range-Mutation]
The behaviour of the following example is supposed to be correct ?
(Testing with Firefox 2)
How to keep the second range to select the same portion of text ?
<html>
<head>
<title>Range test</title>
</head>
<body>
<div id="myText">FooBarBaz</div>
<script type="text/javascript">
myText = document.getElementById('myText').firstChild;
var range1 = document.createRange();
range1.setStart(myText, 3);
range1.setEnd(myText, 6);
var range2 = document.createRange();
range2.setStart(myText, 6);
range2.setEnd(myText, 9);
// as you can see we selected 'bar' and 'baz'
alert('range1: '+range1.toString()+' range2:'+range2.toString());
// let's surround 'bar' with a bold tag....
var newNode1 = document.createElement("b");
range1.surroundContents(newNode1);
// after surrounding range1, range2 doesn't anymore contain 'baz' !!!
alert('range1: '+range1.toString()+' range2:'+range2.toString());
</script>
</body>
</html>
Thanks for any advice.
Alessandro