Window.innerWidth - Web API 接口参考 编辑

只读的 Window 属性 innerWidth 返回以像素为单位的窗口的内部宽度。如果垂直滚动条存在,则这个属性将包括它的宽度。

更确切地说,innerWidth 返回窗口的 layout viewport 的宽度。 窗口的内部高度——布局视口的高度——可以从 innerHeight 属性中获取到。

语法

let intViewportWidth = window.innerWidth;

一个整数型的值表示窗口的布局视口宽度是以像素为单位的。这个属性是只读的,并且没有默认值。

若要更改窗口的宽度,请使用 Window 的方法来调整窗口的大小,例如resizeBy() 或者 resizeTo()

使用说明

如果你需要获取除去滚动条和边框的窗口宽度,请使用根元素 <html>  的clientWidth 属性。

innerWidth 属性在任何表现类似于窗口的任何窗口或对象(例如框架或选项卡)上都是可用的。

示例

// 返回视口的宽度
var intFrameWidth = window.innerWidth;

// 返回一个框架集内的框架的视口宽度
var intFrameWidth = self.innerWidth;

// 返回最近的父级框架集的视口宽度
var intFramesetWidth = parent.innerWidth;

// 返回最外层框架集的视口宽度
var intOuterFramesetWidth = top.innerWidth;

规范

规范状态说明
CSS Object Model (CSSOM) View Module
window.innerWidth
Working Draft初识定义

浏览器兼容性

BCD tables only load in the browser

此页面上的兼容性表格是根据结构化数据生成的。如果您想贡献数据,请查看https://github.com/mdn/browser-compat-data 并向我们发送一个拉取请求。

参考

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

词条统计

浏览:62 次

字数:3730

最后编辑:6年前

编辑次数:0 次

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文