English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

JavaScript 对象

JavaScript 参考手册

JS DOM参考手册

Window innerWidth 属性

JavaScript Window オブジェクト

innerWidth只读属性返回窗口内容区域(视口)的宽度，包括滚动条。

使用outerWidth属性获取整个浏览器窗口的宽度。

语法：

window.innerWidth
var　h　=　window.innerHeight;
var　w　=　window.innerWidth;
テストを見て‹/›

浏览器兼容性

表中的数字指定了完全支持innerWidth属性的第一个浏览器版本：

属性
innerWidth11939

技术细节

返回值：一个数字，表示浏览器窗口内容区域的内部宽度，以像素为单位

更多实例

使用onresize事件显示高度和宽度：

<body　onresize="myFunc()">
<script>
function　myFunc()　{
　　　var　w　=　window.innerWidth;
　　　var　h　=　window.innerHeight;
　　　document.getElementById("para").innerHTML　=　"Width:　"　+　w　+　"<br>Height:　"　+　h;
}
</script>
テストを見て‹/›

跨浏览器解决方案（对于IE8和更早版本使用clientWidth和clientHeight）：

var　h　=　window.innerHeight
||　document.documentElement.clientHeight
||　document.body.clientHeight;
var　w　=　window.innerWidth
||　document.documentElement.clientWidth
||　document.body.clientWidth;
テストを見て‹/›

この例では、innerWidth、innerHeight、outerWidth、externalHeightを一つの例で表示しています：

var　txt　=　"";
txt　+=　"<p>innerWidth:　"　+　window.innerWidth　+　"</p>";
txt　+=　"<p>innerHeight:　"　+　window.innerHeight　+　"</p>";
txt　+=　"<p>outerWidth:　"　+　window.outerWidth　+　"</p>";
txt　+=　"<p>outerHeight:　"　+　window.outerHeight　+　"</p>";
document.write(txt);
テストを見て‹/›

関連参考

ウィンドウ(Window)参考：window.innerHeight属性

ウィンドウ(Window)参考：window.outerHeight属性

ウィンドウ(Window)参考：window.outerWidth属性

JavaScript Window オブジェクト

JS Storage オブジェクトJavaScript Window オブジェクト