js如何获得页面的大小?

JavaScript011

js如何获得页面的大小?,第1张

<script type="text/javascript"> <!--

var winWidth = 0

var winHeight = 0

function findDimensions() //函数:获取尺寸

{

//获取窗口宽度

if (window.innerWidth)

winWidth = window.innerWidth

else if ((document.body) &&(document.body.clientWidth))

winWidth = document.body.clientWidth

//获取窗口高度

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 &&

document.documentElement.clientWidth)

{

winHeight = document.documentElement.clientHeight

winWidth = document.documentElement.clientWidth

}

//结果输出至两个文本框

document.form1.availHeight.value= winHeight

document.form1.availWidth.value= winWidth

}

findDimensions() //调用函数,获取数值

window.onresize=findDimensions

//-->

</script>

jsp获取浏览器宽度是通过js来实现的。

JS 获取浏览器窗口大小

// 获取窗口宽度

if (windows.innerWidth)

winWidth = windows.innerWidth

else if ((document.body) &&(document.body.clientWidth))

winWidth = document.body.clientWidth

// 获取窗口高度

if (windows.innerHeight)

winHeight = windows.innerHeight

else if ((document.body) &&(document.body.clientHeight))

winHeight = document.body.clientHeight

// 通过深入 Document 内部对 body 进行检测,获取窗口大小

if (document.documentElement &&document.documentElement.clientHeight &&document.documentElement.clientWidth)

{

winHeight = document.documentElement.clientHeight

winWidth = document.documentElement.clientWidth

}

先来一个浏览器窗口大小改变的事件,用来查看浏览器窗口的大小被改变可以触发一些函数

window.onresize 浏览器窗口大小改变事件

在写js的时候偶尔需要获取各种高度,比如;浏览器高度,页面高度,滚动高度等。

(不加边线):

网页可见区域的高度和宽度(加边线):