Как получить положение и размер текстового узла HTML с помощью javascript?

Например,

<div style="width:100px;text-align:center">text</div>

Я хочу получить положение и размер text текстовый узел , а не его div фантик. Возможно ли это?

1 ответов


в современных браузерах (последние-ish Mozilla, WebKit и Opera) вы можете использовать getClientRects() метод диапазона DOM, который охватывает текстовый узел.

var textNode = document.getElementById("wombat").firstChild;
var range = document.createRange();
range.selectNodeContents(textNode);
var rects = range.getClientRects();
if (rects.length > 0) {
    console.log("Text node rect: ", rects[0]);
}
<div id="wombat">Wombat</div>