JavaScriptではディスプレイの画面サイズやウィンドウのサイズ、要素のサイズなどを取得することが出来ます。画面のサイズやスクロールバーを含まない、あるいは含んだウィンドウサイズの取得につい … JavaScriptでスクリーン ・ウインドウ・画面サイズなどを取得しようとすると、 screen.widthや window.innerWidthなど、候補がいくつか出てきませんか？どれを使用するかでどこのサイズを取得するかが変わったり、デバイスによって結果が変わったりしてややこしいので、少し整理してみようかと思 … ところで「JavaScriptで特定の要素の幅や高さを取得して何かをしたい」という場面って結構あります。 特定の要素の幅や高さを取得する方法はいくつかありますが、今回は「clientWidth,clientHeight」を使う方法について書きました。 「画面サイズを取得する際のjQueryやJavaScriptとCSSメディアクエリの違い」比較画面を別枠で表示. JavaScriptを使って閲覧者のディスプレイ(画面)サイズを知るには、window.screenオブジェクトの各プロパティを参照します。画面の横幅はwindow.screen.widthで、高さはwindow.screen.heightで得られます。画面サイズではなく、ブラウザの大きさや描画領域のサイズを知るにはwindowオブジェクトの各プ … Webアプリでレイアウトを制御しようとすると様々な画面サイズを把握する必要があります。iPhoneのシミュレーター上のSafariでの動作結果をまとめました。 取得方法 Webブラウザーのクライアント領域の論理ピクセル数 Webブラウザーが1画面で表示できる範囲です。 JavaScriptで画面サイズを取得するためのプロパティが用意されています。 ウィンドウサイズを取得できる関数 screen.width document.write(screen.width); 画面の幅を取得することが出来ます。 screen.height document.write(screen.height); 画面サイズを取得する. 物理画面サイズが推定できると、いろいろな判断に使えます。 汎用的にデバイスのサイズを推定する役目としては十分な精度かなとは思うがどうでしょう。 とりあえず実際の物理画面サイズに近い数値を取得できるようにはなると思います。 まとめ. 各スクリプト処理で取得したウィンドウサイズ値が画面のテーブルに表示されます。 ※幅だけでなく高さ「height」の値も併せて表示しています。 取得する処理は JavaScriptでdivなどの要素のサイズを取得する方法です。 .styleで取得する方法と、.getBoundingClientRect()で取得する方法の2種類があります。 サンプルソース 一番シンプルな方法は、CSSの設定値を取得する.styleを使う方法です。 例）幅を「.style.width」で取得する