store a selection

see http://stackoverflow.com/questions/3868232/javascript-remember-selected-range-of-a-text

HTML

<html>
    <head>
    <title>title</title>
    <script type="text/jscript">
    <!--
    //-->
    </script>

    </head>
    <body>
      <center>
        <iframe src="about:blank"></iframe>
        <input type="button" value="cloneSelection()" onclick="cloneSelection()">
        <iframe src="about:blank"></iframe>
      </center>
    </body>
    </html>

CSS

iframe{width:400px;height:200px;}

JavaScript

function cloneSelection()
    {
      if(!document.all || window.opera)
      {
        alert('this is an jscript-example for MSIE5+');
        return;
      }
      var editors=window.frames;  
          editors[0].focus();    
  
      //create 2 ranges in the first iframe 
      var r1=editors[0].document.selection.createRange();
      var r2=editors[0].document.selection.createRange();
  
      //checkout if a control is selected
      if(editors[0].document.selection.type==='Control')
      {    
        var obj=r1.item(0);
        var objs=editors[0].document.body.getElementsByTagName(obj.tagName);
    
        //iterate over the elements to get the index of the element
        for(var i=0;i<objs.length;++i)
        {
          if(objs[i]===obj)
          {
            //create a controlRange, add the found control and select it
            var controls=editors[1].document.body.createControlRange();
                controls.add(editors[1].document.body.getElementsByTagName(obj.tagName)[i]);
                controls.select()
            return;
          }
        }
        //control-branch done
      }
  
      //no control was selected, so we work with textRanges  
      //collapse the 2nd range created above 
      r2.collapse(false); 
  
      //store the positions of the 2 ranges
      var x1=r1.offsetLeft;
      var y1=r1.offsetTop;
      var x2=r2.offsetLeft;
      var y2=r2.offsetTop;
  
      //create ranges in the 2nd iframe and move them to the stored positions
      var r2=editors[1].document.body.createTextRange();
          r2.moveToPoint(x1,y1);
      var r3=editors[1].document.body.createTextRange();
          r3.moveToPoint(x2,y2);
  
      //set the move the end of the first range to start of the 2nd range
      r2.setEndPoint('EndToStart',r3);
  
      //select the first range
      r2.select(); 
}


    //fill the iframes and make them editable
    window.onload=function()
    {
      var editors=window.frames;
      for(var...