① js 如何获得浏览器的高度
要在js中获得浏览器的高度可以参考以下步骤(具体代码见最后):
1、outerHeight属性设置或返回一个窗口的外部高度,包括所有界面元素(如工具栏/滚动条)。
2、outerWidth属性设置或返回窗口的外部宽度,包括所有的界面元素(如工具栏/滚动)。
3、innerheight 返回窗口的文档显示区的高度。
4、innerwidth 返回窗口的文档显示区的宽度。
补充:
在浏览器兼容方面:
1、所有主流浏览器都支持 outerWidth 和 outerHeight 属性。
注意:IE 8 及更早 IE 版本不支持该属性。
2、所有主流浏览器都支持 innerWidth 和 innerHeight 属性。
注意:IE 8 及更早 IE版本不支持这两个属性。
获取代码:
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<head>
<title>请调整浏览器窗口</title> <meta http-equiv="content-type" content="text/html; charset=gb2312">
</meta></head>
<body>
<h2 align="center">请调整浏览器窗口大小</h2><hr />
<form action="#" method="get" name="form1" id="form1">
<!--显示浏览器窗口的实际尺寸-->
浏览器窗口 的 实际高度: <input type="text" name="availHeight" size="4"/><br />
浏览器窗口 的 实际宽度: <input type="text" name="availWidth" size="4"/><br />
</form>
<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>
</body>
</html>
② js或者jquery如何实时获取浏览器的高度和宽度的
jquery
$(function(){
/*调整窗口自动调整宽度*/
$(window).resize(function(){
var h = $(window).height();
var w = $(window).width();
console.info("窗口高度:" + h + "; 窗口宽度:" + w);
});
});
③ 如何用 js 取得浏览器的高度并赋值给div
js取得浏览器的高度并赋值给div的步骤如下:
1."http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><title>
2.请调整浏览器窗口大小</h2><hr/><formaction="#"method="get"name="form1"id="form1"><!--
3.显示浏览器窗口的实际尺寸-->浏览器窗口的实际高度:<inputtype="text"name="availHeight"size="4"/><br/>
4.浏览器窗口的实际宽度:<inputtype="text"name="availWidth"size="4"/><br/></form><scripttype="text/javascript"><!--varwinWidth=0;varwinHeight=0;functionfindDimensions()
5.//函数:获取尺寸{//获取窗口宽度if(window.innerWidth)winWidth=window.innerWidth;elseif((document.body)&&(document.body.clientWidth))winWidth=document.body.clientWidth;//获取窗口高度document.form1.availHeight.value=winHeight;document.form1.availWidth.value=winWidth;}findDimensions();//调用函数,获取数值window.onresize=findDimensions;//--></script></body></html>
④ 【急】高分求完整的js获取浏览器个要素高度宽度值的方法!!!!
在IE下:
获取浏览器可见区域宽度:width = document.documentElement.clientWidth;
获取浏览器可见区域高度:height = document.documentElement.clientHeight;
Body对象宽度:width = document.body.clientWidth;
Body对象高度:height = document.body.clientHeight;
firefox和IE一样...
在Opera下:
获取浏览器可见区域宽度:width = document.body.clientWidth;
获取浏览器可见区域高度:height = document.body.clientHeight;
Body对象宽度:width = document.documentElement.clientWidth;
Body对象高度:height = document.documentElement.clientHeight;
在没有定义W3C标准下...
三种浏览器均为:
获取浏览器可见区域宽度:width = document.documentElement.clientWidth;
获取浏览器可见区域高度:height = document.documentElement.clientHeight;
⑤ js获取浏览器高度+上下滚动条的高度,也就是整个网页的高度,需求,要求兼容ie6,7,火狐等主流浏览器
您好!很高兴为您答疑!
给您提供一个代码,根据需要稍做修改就可以了,兼容各浏览器:
function getViewSizeWithoutScrollbar(){//不包含滚动条
return {
width : document.documentElement.clientWidth,
height: document.documentElement.clientHeight
}
}
function getViewSizeWithScrollbar(){//包含滚动条
if(window.innerWidth){
return {
width : window.innerWidth,
height: window.innerHeight
}
}else if(document.documentElement.offsetWidth == document.documentElement.clientWidth){
return {
width : document.documentElement.offsetWidth,
height: document.documentElement.offsetHeight
}
}else{
return {
width : document.documentElement.clientWidth + getScrollWith(),
height: document.documentElement.clientHeight + getScrollWith()
}
}
}
您可以在火狐社区了解更多内容。希望我的回答对您有所帮助,如有疑问,欢迎继续在本平台咨询。
⑥ jquery js获取移动设备浏览器高度
在js使用过程中可能会根据要求获取浏览器高度和宽度。
一、获取浏览器的高度版:
jquery代码直接使用 $(window).height();
原生态权JS代码需要考虑页面DOCTYPE的声明,使用以下代码:
<script>
var w=document.documentElement?document.documentElement.clientHeight:document.body.clientHeight;
alert(w);
</script>
二、获取浏览器的宽度:
jquery代码直接使用 $(window).With();
原生态JS代码:
var w=document.documentElement?document.documentElement.clientWidth:document.body.clientWidth;
⑦ 原生js怎么写判断浏览器窗口的宽高并输出到<section style=“height:xx;width:xx”></section>
document.getElementsByTagName 返回的是一个数组,所以 list 是一个数组,list 就没有 style 属性。list.style 就是 undefined,你给 list.style 的 height 属性赋值,就报错了,说你给一个 undefined 的 height 属性赋值。
要修改的地方是,如果你有多个 section 都要处理,那就循环一下:
for(vari=0,l=list.length;i<l;i+=1){
list[i].style.height=winHeight;
list[i].style.width=winWidth;
}