zoukankan      html  css  js  c++  java
  • 如何用 js 获取table 或者其他块状标签的 宽和高

    这个比较简单,总体思想,标签标记一个id,js获取id,就能用它的属性了。介绍两种方法。请看下面代码。

    第一种

      1 <script>
      2 
      3 function width_table_all() {
      4           
      7             var tabl = document.getElementById("tabl").offsetWidth;
      8             alert(tabl);
     11         }183 </script>

    这个是js的函数,offsetWidth是一个属性。tabl是id,请看下面的table 里面的id

     1 <table id="tabl" width="100%"  height='80%' border='0' style='border-collapse: collapse' cellpadding='0' cellspacing='0' >
     2      <tr>
     3       <td colspan='3'><img src='pack_map/1.png' width='100%' height='100%'></td>
     4         
     5       </tr>
     6       <tr>
     7         <td id="td_1" align='left' valign="top" width='60%' height='20%'><img src='pack_map/2.jpg' width='100%' height='100%'></td>
     8         <td id="td_2"  align='left'  width='13%' ><img src='pack_map/5.jpg' width='100%' height='100%'></td>
     9         <td id="td_3"  align='left'  width='30%' ><img src='pack_map/4.jpg' width='100%' height='100%'></td> 
    10       </tr>
    11       <tr>
    12         <td  align='left' width='50%' colspan='2'><img src='pack_map/8.jpg' width='100%' height='100%'></td>
    13         <td  align='left' width='30%'  ><img src='pack_map/7.jpg' width='100%' height='100%'></td>
    14      </tr>
    15      <tr>
    16         <td  id="td_4" align='left' width='60%' height='20%' ><img src='pack_map/3.jpg' width='100%' height='100%'></td>
    17         <td  id="td_5" align='left' width='13%' ><img src='pack_map/6.jpg' width='100%' height='100%'></td>
    18         <td  id="td_6" align='left' width='30%' ><img src='pack_map/3.png' width='100%' height='100%'></td>
    19      </tr>
    20  </table>

    第二种

    1 var tabl = document.getElementById("tabl").rows[0].cells[0].offsetWidth;

    这种是可以特定的找到第几行,第几列的宽。

    上面说的只是宽,对于其他属性,颜色,高度,等等,都可以用这种方法获取。

  • 相关阅读:
    MongoDB compass 连接不上远程服务器的解决方法
    art-template 模版引擎
    mongodb数据库的集合关联
    捕获mongoogse 错误信息
    inux下使用自带mail发送邮件告警
    rinted端口转发工具
    windows安装PHP IIS MYSQL
    sql语句查询知识点
    maven加速镜像
    docker启动容器关于防火墙报错
  • 原文地址:https://www.cnblogs.com/linguanh/p/4131694.html
Copyright © 2011-2022 走看看