javascriptを使用してHTMLテキストノードの位置とサイズを取得する方法は？例については

、javascriptを使用してHTMLテキストノードの位置とサイズを取得する方法は？例については

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

私はtextテキストノードではなく、そのdivラッパーの位置とサイズを取得したいです。出来ますか？

出典

2013-04-25 benjaminchanming

あなたはdivの位置を取得することができ、その後、あなたは任意の上部と左側のパディングとボーダーを追加する必要があります。 – Asken

@ user125697： 'text'はノードであり、要素ではありません。その質問は重複しません。 – benjaminchanming

[this]（http://stackoverflow.com/questions/7913631/jquery-get-position-of-character-in-a-div） – anpsmn

最新のブラウザ（最近のMozilla、WebKit、Opera）では、テキストノードを含むgetClientRects() method of a DOM rangeを使用できます。

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>

出典

2013-04-25 09:21:53

このコードは古いブラウザで動作しますか？もしそうでなければ、古いブラウザのための解決策。 – Domezchoc

@Domezchoc：どの古いブラウザですか？ IEの['TextRange']（http://msdn.microsoft.com/en-us/library/ie/ms535872%28v=vs.85%29.aspx）を使用したソリューションがあります。テキストノードは要素の唯一の子です。さもなければ、それはまだ可能ですが、TextRangeを作成する作業が増えています。 –

私はIEを意味する、私はそれを得た。まず、TextRangeを見つけてからgetClientRectsを取得する必要があります。 – Domezchoc

javascriptを使用してHTMLテキストノードの位置とサイズを取得する方法は？例については

答えて

関連する問題