用 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+ 檢視

開始你的 事業

完成課程即可獲得認證

開始
廣告
© . All rights reserved.