PR
構文
 
 document.要素.clientWidth  [DOM属性]
総合 インデックス
プロパティ
FirefoxIE

説明

  •  body要素の「clientWidth」属性の値を持つ。DOMに対応したブラウザでは,JavaScriptを使ってbody要素の情報を取得することが可能になった。その中で,要素の横幅の値を持つ「clientWidth」属性を使うと,body要素,つまりブラウザのコンテンツ表示領域の横幅の値を取得することができる。documentElement要素の場合もあるが,標準モードと互換モード,あるいはWebブラウザの種類によって値が異なるので注意が必要となる。
  •  JavaScriptには,ウインドウの内周,つまりブラウザのコンテンツ表示領域の横幅の値を持つ,windowオブジェクトの「innerWidth」プロパティがある。しかし,このプロパティは,Internet Explorerでは,サポートされていない。だが,「clientWidth」属性と「innerWidth」プロパティは,同じ値となるので,Internet Explorerで,ウインドウの内周の横幅の値を取得する時には,この「clientWidth」属性を使用すればよいことになる。読み出し専用。
  •  用例では,「clientWidth」属性を使って,body要素の横幅の値を取得し,書き出している。

用例

id名「BodyWidth」を設定したbody要素の横幅の値を取得し書き出す。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<meta http-equiv="Content-Script-Type" content="text/javascript">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>clientWidth</title>
<style type="text/css">
<!--
body { background-color: #ffffff; }
-->
</style>
</head>
<body id="BodyWidth">
*クライアントの横幅
<p>
<script type="text/javascript">
<!--
document.write("body要素の横幅:")
document.write(document.getElementById("BodyWidth").clientWidth)
//-->
</script>
</p>
</body></html>

この用例を実行する