导航:首页 > 编程语言 > js赋值高度

js赋值高度

发布时间:2025-08-21 15:21:13

Ⅰ body height=100% js 获取 实际高度

如果是body不需要勇ID的形式来获取的:

<scripttype="text/javascript">
vars="";
document.documentElement.scrollTop就是滚动条距离顶部的位置(可变)
document.documentElement.scrollLef指滚动条距离左边的位置(可变)
s+=" <br>网页可见区域宽:"+document.body.clientWidth;
s+=" <br>网页可见区域高:"+document.body.clientHeight;
s+=" <br>网页可见区域宽:"+document.body.offsetWidth+"(包括边线的宽)";
s+=" <br>网页可见区域高:"+document.body.offsetHeight+"(包括边线的宽)";
s+=" <br>网页正文全文宽:"+document.body.scrollWidth;
s+=" <br>网页正文全文高:"+document.body.scrollHeight;
s+=" <br>网页被卷去的高:"+document.body.scrollTop;
s+=" <br>网页被卷去的左:"+document.body.scrollLeft;
s+=" <br>网页正文部分上:"+window.screenTop;
s+=" <br>网页正文部分左:"+window.screenLeft;
s+=" <br>屏幕分辨率的高:"+window.screen.height;
s+=" <br>屏幕分辨率的宽:"+window.screen.width;
s+=" <br>屏幕可用工作区高度:"+window.screen.availHeight+"(去掉状态栏)";
s+=" <br>屏幕可用工作区宽度:"+window.screen.availWidth;
//alert(s);
document.write(s);
</script>

Ⅱ 求一段JS 获取子元素自适应高度值并赋予其父元素相同的高度值

楼主请详细说明,最好能贴出html和css 代码,在线等!
因为没有html代码,自己写了个基本符合楼主的需求,测试没有太大问题,楼主只用更改下样式就可以了。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style type="text/css" media="screen">
*{
margin: 0;
padding: 0;
}
ul,li{
list-style: none;
}
.tag{
position: relative;
width: 600px;
}

.tag li{
width: auto;
float: left;
text-align: center;
line-height: 30px;
background: #ccc;
height: 30px;
padding: 0px 20px 0px 20px;
margin:0px 10px 0px 10px;
}
.tag .show{
display: none;
top: 30px;
width: 250px;
height: auto;
overflow: hidden;
position: absolute;
background: #f00;
}
.tag .show dd{
width: auto;
float: left;
line-height: 30px;
background: #ccc;
height: 30px;
padding: 0px 20px 0px 20px;
margin:2px 10px 2px 10px;
}
</style>
</head>

<body>
<div class="tag" id="show">
<ul>
<li>示例1</li>
<li>示例2</li>
<li>示例3</li>
</ul>
<div class="show">
<dl>
<dd>第一个</dd>
<dd>第一</dd>
<dd>第一个第二个</dd>
<dd>第一个第二个</dd>
<dd>第一个第二个</dd>
</dl>
</div>
<div class="show">
<dl>
<dd>第一个第二个</dd>
<dd>第一个第二个</dd>
<dd>第一个第二个</dd>
<dd>第一个第二个</dd>
<dd>第一个第二个</dd>
</dl>
</div>
<div class="show">
<dl>
<dd>第一个</dd>
<dd>第二个</dd>
<dd>lalalal</dd>
</dl>
</div>
</div>
<script type="text/javascript">
var show = document.getElementById('show'),
nav = show.getElementsByTagName('li'),
tag = show.getElementsByTagName('div');

for(var i = 0; i < nav.length; i++) {
nav[i].index = i;
nav[i].onmouseover = function () {
showTag(this.index);
}
nav[i].onmouseout = function () {
tag[this.index].style.display = 'none';
}
}

function getClass(dom, type) {
if (dom.currentStyle) {
return dom.currentStylep[type];
}
else {
return getComputedStyle(dom,false)[type];
}
}

function getLeftPos (index) {
if (index == 0) {
return 0;
}
else {
var count = 0;

for(var i = 0; i < index; i++) {
count += parseInt(getClass(nav[i], 'width'));
count += parseInt(getClass(nav[i], 'padding-left'));
count += parseInt(getClass(nav[i], 'padding-right'));
count += parseInt(getClass(nav[i], 'margin-left'));
count += parseInt(getClass(nav[i], 'margin-right'));
}

return count += (parseInt(getClass(nav[index], 'width')) + parseInt(getClass(nav[index], 'padding-left')) + parseInt(getClass(nav[index], 'margin-left')) + parseInt(getClass(nav[index], 'margin-right')) ) /2;
}
}

function showTag(index) {
// var nWidth = parseInt(getClass(nav[index], 'width')),
// nLeftPading = parseInt(getClass(nav[index], 'padding-left')),
// nRightPading = parseInt(getClass(nav[index], 'padding-right')),
// nLeftMargin = parseInt(getClass(nav[index], 'margin-left'));
var pos = getLeftPos(index),
twow = parseInt(getClass(tag[index], 'width')) / 2,
num = pos + twow;

tag[index].style.left = pos + 'px';
tag[index].style.display = 'block';
}
</script>
</body>
</html>

Ⅲ JS jq 获取两个子元素高度 判断最大值赋值给父元素 动态加载的 怎麽弄

假设HTML结构如下:

<divclass="parent">
<divid="child1"></div>
<divid="child2"></div>
</div>

则对应的回JS代码为答:

varchild1=document.getElementById('child1'),
child2=document.getElementById('child2');
varheight=Math.max(child1.offsetHeight,child2.offsetHeight);
child1.parentNode.style.height=height+'px';

Ⅳ 如何通过js给div的style动态赋值

需要准来备的材料分别有:自电脑、html编辑器、浏览器。

1、首先,打开html编辑器,新建html文件,例如:index.html,填充问题基础代码。

Ⅳ JS获取body的高度

1、document.body.clientWidth;//网页可见区域宽

2、document.body.clientHeight;//网页可见区域高

3、document.body.offsetWidth;//网页可见区域宽(包括边线的宽)

4、document.body.offsetHeight;//网页可见区域高(包括边线的高)

5、document.body.scrollWidth;//网页正文全文宽

6、window.screen.availHeight;//屏幕可用工作区高度

7、window.screen.availWidth;//屏幕可用工作区宽度

8、alert($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度 包括border padding margin

9、alert($(document.body).width());//浏览器时下窗口文档body的高度

(5)js赋值高度扩展阅读:

1、alert($(window).height()); //浏览器时下窗口可视区域高度

2、alert($(document).height()); //浏览器时下窗口文档的高度

3、alert($(document.body).height());//浏览器时下窗口文档body的高度

4、alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度 包括border padding margin

5、alert($(window).width()); //浏览器时下窗口可视区域宽度

6、alert($(document).width());//浏览器时下窗口文档对于象宽度

7、alert($(document).scrollTop()); //获取滚动条到顶部的垂直高度

8、alert($(document).scrollLeft()); //获取滚动条到左边的垂直宽度

阅读全文

与js赋值高度相关的资料

热点内容
华为pad摄像头在哪个文件夹 浏览:147
手机版编程猫如何复制角色 浏览:599
动漫图片的文件格式 浏览:560
黑衣紧身美女跳小苹果 浏览:670
无法收缩数据库 浏览:216
java中获取二维数组的长度 浏览:510
手机里面的数据线怎么接 浏览:491
微信转帐是红包吗 浏览:748
如何学会函数编程 浏览:985
js赋值高度 浏览:940
录像机登录密码 浏览:94
中断程序格式 浏览:543
微信电话本批量删除联系人 浏览:439
hp5200固件升级文件 浏览:176
除了问卷星还有哪里收集数据 浏览:387
如何编程五子棋盘 浏览:747
微信相册空间 浏览:839
苹果怎么刷回935 浏览:437
linux的模板文件在哪个文件夹 浏览:923
企业网络规划拓扑图 浏览:927

友情链接