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

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>