js 设置一个元素的高度,只能用style吗?

JavaScript017

js 设置一个元素的高度,只能用style吗?,第1张

JS设置一个元素的高度直接在CSS中定义其height高度是最直接高效的,也是最通用的做法。

如果在页面使用时,需要动态改变元素的高度,可以使用JS代码来重新改变这个元素的高度。比如

<div id="box" style="width:500pxheight:100pxborder:1px solid #ccc">内容</div>

<script>

//原来的div元素设置的高度是100px下面的JS可以改变其高度为300px

document.getElementById("box").style.height="300px"

</script>

方法只有一种。

步骤:

1、获取table的dom节点

2、通过js设置table的height属性

代码示例

<body>

<table id='test' border='1'> 定义一个table

<tr>

  <td>111</td><td>222</td>

</tr>

</table>

<script>

var tb = document.getElementById('test')//获取table的dom节点

tb.setAttribute('height',300)//设置table高度为300

</script>

编写相应程序代码即可。

代码如下:

<script>

function getInfo()

{

var s = ""

s += " 网页可见区域宽:"+ document.body.clientWidth

s += " 网页可见区域高:"+ document.body.clientHeight

s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"

s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"

s += " 网页正文全文宽:"+ document.body.scrollWidth

s += " 网页正文全文高:"+ document.body.scrollHeight

s += " 网页被卷去的高(ff):"+ document.body.scrollTop

s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop

s += " 网页被卷去的左:"+ document.body.scrollLeft

s += " 网页正文部分上:"+ window.screenTop

s += " 网页正文部分左:"+ window.screenLeft

s += " 屏幕分辨率的高:"+ window.screen.height s += " 屏幕分辨率的宽:"+ window.screen.width

s += " 屏幕可用工作区高度:"+ window.screen.availHeight

s += " 屏幕可用工作区宽度:"+ window.screen.availWidth

s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"

s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"

//alert (s)

}

getInfo()

</script>