Internet Explorer TextRange中的字符偏移量

Character offset in an Internet Explorer TextRange

本文关键字：字符 偏移量 Explorer TextRange Internet      更新时间：2023-09-26

据我所知，在Internet Explorer中，没有简单的方法可以从TextRange对象中检索字符偏移量。W3C Range对象有一个节点，并且偏移到该节点内的文本中。IE似乎只是有像素偏移。有一些方法可以创建、扩展和比较范围，所以可以编写一个算法来计算字符偏移量，但我觉得我一定遗漏了一些东西。

那么，计算InternetExplorerTextRange开头的字符偏移量的最简单方法是什么呢？

我使用了一种基于插入符号位置技巧的方法：

// Assume r is a range:
var offsetFromBody = Math.abs( r.moveEnd('character', -1000000) );

由于moveEnd返回实际移动的字符数，因此偏移量现在应该是文档开头的偏移量。这对于测试基元插入符号的移动很有效，但对于扩展的选择和获得包含范围锚的确切节点，您需要更复杂的东西：

// where paramter r is a range:
function getRangeOffsetIE( r ) {
  var end = Math.abs( r.duplicate().moveEnd('character', -1000000) );
  // find the anchor element's offset
  var range = r.duplicate();
  r.collapse( false );
  var parentElm = range.parentElement();
  var children = parentElm.getElementsByTagName('*');
  for (var i = children.length - 1; i >= 0; i--) {
    range.moveToElementText( children[i] );
    if ( range.inRange(r) ) {
      parentElm = children[i];
      break;
    }
  }
  range.moveToElementText( parentElm );
  return end - Math.abs( range.moveStart('character', -1000000) );
}

这应该返回正确的插入符号文本偏移量。当然，如果您已经知道目标节点，或者能够提供上下文，那么您可以跳过整个循环搜索混乱。

我建议使用IERange，或者只是其中的TextRange到DOM Range算法。

更新，2011年8月9日

我现在建议使用我自己的Rangy库，它在思想上与IERange相似，但更充分地实现和支持。

我使用了一个稍微简单一点的解决方案，使用textRange的偏移值：

function getIECharOffset() {
  var offset = 0;
  // get the users selection - this handles empty selections
  var userSelection = document.selection.createRange();
  // get a selection from the contents of the parent element
  var parentSelection = userSelection.parentElement().createTextRange();
  // loop - moving the parent selection on a character at a time until the offsets match
  while (!offsetEqual(parentSelection, userSelection)) {
    parentSelection.move('character');
    offset++;
  }
  // return the number of char you have moved through
  return offset;
}
function offsetEqual(arg1, arg2) {
  if (arg1.offsetLeft == arg2.offsetLeft && arg1.offsetTop == arg2.offsetTop) {
    return true;
  }
  return false;
}

您可以使用String.substring()迭代主体元素的TextRange.text属性，以与您想要的字符偏移量的TextRange进行比较。

function charOffset(textRange, parentTextRange)
 { var parentTxt = parentTextRange.text;
   var txt       = textRange.text;
   var parentLen = parentTxt.length;
   for(int i=0; i < parentLen ; ++i) 
    { if (parentTxt.substring(i, txt.length+i) == txt) 
       { var originalPosition = textRange.getBookmark();
         //moves back one and searches backwards for same text
         textRange.moveStart("character",-1);
         var foundOther = textRange.findText(textRange.text,-parentLen,1);
         //if no others were found return offset
         if (!foundOther) return i;
         //returns to original position to try next offset
         else textRange.moveToBookmark(originalPosition);
       }
    }
   return -1;
 }

[参考findText()]

相关文章：