用 JavaScript 获取屏幕、当前网页和浏览器窗口的大小

要获取网页的当前屏幕大小，请使用 window.inner。我们还可以使用 window.outerWidth 和 window.outerHeight，如下所示，来获取网络浏览器窗口的外宽度和高度。

我们将看到两个示例 −

  • 获取内部宽度和高度
  • 获取外部宽度和高度

获取内部宽度和高度

要获取网页的当前屏幕大小，请使用 window.innerWidth 和 window.innerHeight −

var wd = window.innerWidth;
var ht = window.innerHeight;

示例

让我们看一个示例 −

<!DOCTYPE html>
<html>
<body>
   <h1>Current Browser Window Size</h1>
   <p>Following is the size of the current window:</p>
   <p id="test"></p>
   <script>
      var wd = window.innerWidth;
      var ht = window.innerHeight;
      var x = document.getElementById("test");
      x.innerHTML = "Width = " + wd + ", Height = " + ht + ".";
   </script>
</body>
</html>

输出

获取外部宽度和高度

使用 window.outerWidth 和 window.outerHeight，如下所示，来获取网络浏览器窗口的外宽度和高度 −

var wd = window.outerWidth;
var ht = window.outerHeight;

示例

让我们看示例 −

<!DOCTYPE html>
<html>
<body>
   <h1>Outer Width and Height</h1>
   <p>Following is the size:</p>
   <p id="test"></p>
   <script>
      var wd = window.outerWidth;
      var ht = window.outerHeight;
      var x = document.getElementById("test");
      x.innerHTML = "Width = " + wd + ", Height = " + ht + ".";
   </script>
</body>
</html>

输出

更新于: 01-11-2022

1K+ 查看

开始你的 事业

完成课程即可获得认证

开始
广告