原生JS 窗口尺寸：
console.log('window.innerWidth = ' + window.innerWidth + '---window.innerHeight = ' + window.innerHeight)
console.log('document.body.clientWidth = ' + document.body.clientWidth + '---document.body.clientHeight = ' + document.body.clientHeight)
JQuery 窗口尺寸：
console.log($(window).height()); //浏览器时下窗口可视区域高度
console.log($(document).height()); //浏览器时下窗口文档的高度
console.log($(document.body).height());//浏览器时下窗口文档body的高度
console.log($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border padding margin
console.log($(window).width()); //浏览器时下窗口可视区域宽度
console.log($(document).width());//浏览器时下窗口文档对于象宽度
console.log($(document.body).width());//浏览器时下窗口文档body的高度
console.log($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度 包括border padding margin
console.log($(document).scrollTop()); //获取滚动条到顶部的垂直高度
console.log($(document).scrollLeft()); //获取滚动条到左边的垂直宽度转载地址：https://www.cnblogs.com/tiger95/p/6907194.html
附页面加载后自动设置div高度：
//页面代码
<body>
<div id="div1" class="clear" style="margin: 0px auto;clear: both;">
您的页面内容。
</div>
</body>
//JS代码
var winHeight = 0;
function findDimensions() //函数：获取尺寸
{
//获取窗口高度
if (window.innerHeight)
winHeight = window.innerHeight;
else if ((document.body) && (document.body.clientHeight))
winHeight = document.body.clientHeight;
//通过深入Document内部对body进行检测，获取窗口大小
if (document.documentElement && document.documentElement.clientHeight)
{
winHeight = document.documentElement.clientHeight;
}
document.getElementById("div1").style.height= winHeight+"px";
}
findDimensions();
//调用函数，获取数值
window.onresize=findDimensions;
监听浏览器窗口变化，重新设置容器高度或宽度
JavaScript方式：
onresize属性可以用来获取或设置当前窗口的resize事件的事件处理函数（和上面的方式一样）
<html>
<head>
<title>onresize测试</title>
<script type="text/javascript">
window.onresize = resize;
function resize()
{
alert("检测到resize事件!");
}
</script>
</head>
<body>
<p>改变浏览器窗口的大小来触发resize事件.</p>
</body>
//或者在以上的js代码块里这样写
window.addEventListener('resize', function() {
// 变化后需要做的事
})
jQuery方式：
<script>
$(document).ready(function() {
$(window).resize(function() {
initWindow(); // 变化后需要做的事
})
})();
</script>
121
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
