Question

当我调整窗口大小时，我可以找到窗口的大小。就像这个

<script type="text/javascript">

    jQuery(window).resize(function () {
      var width = jQuery(window).width();
      var height = jQuery(window).height();
      console.log(width);
      console.log(height);
    })
</script>

现在我想在调整窗口大小时获取文档大小。每次调整窗口大小时，如何获得大小。

Answer 1

$（窗口）.WIDTH（）; //返回浏览器视口的宽度

（文档）$ .WIDTH（）; //返回HTML文档的宽度

http://api.jquery.com/width/

Answer 2

您可以使用document对象：

var width = jQuery(document).width();
var height = jQuery(document).height();

演示：http://jsfiddle.net/wyHwp/

如您所见，当窗口较小时，文档的大小是相同的值。当窗口大于文档需要时，文档将拉伸到窗口大小。

您还可以获得document.body元素的大小：

var width = jQuery(document.body).width();
var height = jQuery(document.body).height();

不同之处在于，即使窗口较高，也会获得body元素的高度，即body元素不会自动伸展到窗口的底部。

Answer 3

不确定你是否想要这个：

jQuery(window).resize(function () {
   var winwidth = jQuery(window).width();
   var winheight = jQuery(window).height();
   var docwidth = jQuery(document).width();
   var docheight = jQuery(document).height();
   console.log('window width is -> ' + winwidth + 'window height is -> ' + winheight);
   console.log('document width is -> ' + docwidth + 'document height is -> ' + docheight);
}).resize();
//-^^^^^^^^----this will log everytime on doc ready

Answer 4

修改示例代码以同时获取它。

<script type="text/javascript">

    jQuery(window).resize(function () {
      var width = jQuery(window).width();
      var height = jQuery(window).height();
      var documentWidth = jQuery(document).width();
      var documentHeight = jQuery(document).height();
      console.log(width);
      console.log(height);
    })
</script>

在窗口调整大小时获取文档的大小

4 个答案: