如何獲得字符偏移X和Y（座標）

Question

在IE中我被告知textRange，但我無法在其他瀏覽器中找到相同的效果。 我需要一種方法來讀取觀察者看到的元素的X，Y偏移量。

Answer 1

Firefox擁有Range對象，而不是在的TextRange IE - https://developer.mozilla.org/en/DOM/range

從第一次看我沒有看到，返回座標的方法，但他們有一些會在4.0，這可能有助於：

https://developer.mozilla.org/en/DOM/range.getBoundingClientRect

返回ClientRect對象 界限的範圍的內容;此 一個矩形，該範圍內包含所有 元素的邊界矩形的聯合。

您也可以看看這裏： https://developer.mozilla.org/en/DOM%3aElement.getClientRects

返回的值是 ClientRect對象，一個與 元素關聯的每個CSS 邊界框的集合。每個ClientRect對象 包含只讀左，上，右 和描述 邊界框，在像素底的特性，與 左上角相對於左上的 視口中，除非該元素是 內的SVG異物對象元素 ，在這種情況下，左上角是相對於最近的異物對象 以及該對象的座標系中的相對位置 。對於帶有 字幕的表，即使在 表格的邊框之外，字幕也包含在內，即使是 。

最初，微軟希望這種方法爲每行文本返回一個TextRectangle 對象。然而， CSSOM工作草案指定 它返回每個 邊框的ClientRect。對於內聯元素， 兩個定義是相同的。但對於 塊元素，Mozilla將僅返回 只有一個矩形。

選擇：

IE：

var range = document.body.createTextRange(); 
range.moveToElementText(myDiv); 
range.select(); 

Firefox，歌劇，，WebKit Nightlies版：

var selection = window.getSelection(); 
var range = document.createRange(); 
range.selectNodeContents(myDiv); 
selection.removeAllRanges(); 
selection.addRange(range); 

Safari瀏覽器：

var selection = window.getSelection(); 
selection.setBaseAndExtent(myDiv, 0, myDiv, 1);