JavaScriptでテキストの幅を見つける

css javascript jquery text width
JavaScriptでテキストの幅を見つける

非表示の要素に対して、Javascript(jQueryが使用されているので、提供されている機能を利用できるので嬉しいです)でテキストの幅を見つける方法はありますか?

ノードのグラフが必要です。 各ノードには内部にテキストがあり、ノードにテキストを制限まで収容できる幅が必要です。 だから私は本質的に隠された「

にいくつかのhtmlが含まれています。 次に、jQueryを使用してそれらを表示します “

グラフの適切な場所にあります。 グラフを適切に作成できるように、事前に正しい幅を知ることが重要です。

  • UPDATE *:明確にするために、非表示のテキストの幅を知る必要があります。 Blenderは以下の答えを出しました、私はそれほどトリッキーな方法がないことを望んでいますか?

  3  0


ベストアンサー

$('#txt').width()

1


どういう幅ですか? もしあなたが「

要素の幅、必要なことだけを行う便利な関数があります。 これらのいくつかで遊んでください:

$('#foo').width();
$('#foo').innerWidth();
$('#foo').outerWidth();

” ” ‘

hidden​​要素の「幅」を見つけるために、私は通常この汚いトリックを行います:

var zIndex = $('#foo').css('z-index');

$('#foo').css('z-index', '-10');
$('#foo').css('position', 'absolute');
$('#foo').css('display', 'block');

var fooWidth = $('#foo').width();

$('#foo').css('display', 'none');
$('#foo').css('z-index', zIndex);

ただし、もっと簡単な方法が必要です…​

1


divのスタイルをラップしないように設定することができます white-space:nowrap(したがって、テキストは1行になります)そして、各divの幅を取得します。テキストの折り返しを許可するスタイル `white-space:normal

1


これに対する非JQueryの答えを投げるだけです。 idがmyworkerdivのwork divがあり、すでにテキストを入力しているとします。

var myDiv document.getElementById('myworkerdiv'),
width = myDiv.clientWidth || myDiv.scrollWidth;

含まれている場合は、高さも調べることができます(clientHeight || scrollHeight)。

0


似たようなブレンダーの方法を使用できますが、表示ではなく可視性cssプロパティを使用します。 可視性:非表示;要素の配置を維持しますが、単に非表示にします。

0


タイトルとURLをコピーしました