如何用 js 获取table 或者其他块状标签的 宽和高

JavaScript09

如何用 js 获取table 或者其他块状标签的 宽和高,第1张

以table为例,首先为其设计class或者id如:id为table

然后进入js中

定义一个对象

var table=document.getelementbyid("table")

这是获取这个元素

然后宽和高

就是table.width

table.height

从字段名称看得出,宽度变化比较大的就是籍贯了,建议你将table的宽度设置成100%,然后里面列不要设置宽度,让其自适应.如果不想td中的文字换行,可以在CSS中控制:

td{white-space:nowrap}

如果要获取宽度可以用以下js

<table width="300" border="1">

  <tr>

    <td>first td</td>

    <td>2</td>

    <td>3</td>

  </tr>

  <tr>

    <td>&nbsp</td>

    <td>&nbsp</td>

    <td>&nbsp</td>

  </tr>

  <tr>

    <td>&nbsp</td>

    <td id="c2">td{ white-space:nowrap}</td>

    <td>&nbsp</td>

  </tr>

</table>

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<script>

alert($("table tr:first td:eq(0)").width())//获取tr第1列的宽度

alert($("#c2").width()) //获取指定ID的td宽度

</script>

给你说下思路,

document.getElementById("top").rows.length可以获得top表的行数

document.getElementById("top").rows[0].cells.length可以获得top表的第一行的列数

document.getElementById("top").rows[0].cells[0].offsetWidth可获得top表第一行第一列的实际宽度,(注意,这个是只读的!)

所以

for(var i=0i<document.getElementById("top").rows[0].cells.lengthi++)

{

document.getElementById("buttom").rows[0].cells[i].width=document.getElementById("top").rows[0].cells[i].offsetWidth

}

希望对你有帮助!