Question

我正在努力寻找一种解决方案来获取浏览器的宽度，而不是文档的宽度。

window.innerWidth

这是获得它的著名方法，但是我想在iframe（小于浏览器的视口）中获取值，但要使用来自浏览器（而非iframe）的度量。就像在Codepen或jsfiddle中进行测试一样，我只能从结果区域中获取宽度。

browser (width: 1260px)
  > body
    > iframe (width: 260px)
    > iframe (width: 1000px)
      here, I want to get the browser value

Answer 1

假设您有类似的东西

<!DOCTYPE html>
<html>
<body>

<iframe id="myFrame" src="https://www.w3schools.com">
  <p>Your browser does not support iframes.</p>
</iframe>

</body>
</html>

要获取 iFrame 宽度：

javascript

document.getElementById("myFrame").width;

jQuery

$("#myFrame").width;

iFrame reference

获取浏览器宽度

javascript

window.parent.width; // or innerwidth

parent reference

要获取屏幕宽度

javascript

screen.width

screen reference

您可以混合使用所有这些技术并获得浏览器中所有内容的宽度

Answer 2

这吗？

console.log(window.outerWidth);

window.innerWidth是浏览器中区域的宽度。毫无疑问，window.outerWidth是浏览器本身的宽度。

如何获取浏览器宽度（不是文档/窗口）？

2 个答案: