如何用 js 获取table 或者其他块状标签的 宽和高
这个比较简单,总体思想,标签标记一个id,js获取id,就能用它的属性了。介绍两种方法。请看下面代码。
第一种
<script>
function width_table_all() {
var tabl = document.getElementById("tabl").offsetWidth;
alert(tabl);
} </script>
这个是js的函数,offsetWidth是一个属性。tabl是id,请看下面的table 里面的id
<table id="tabl" width="100%" height='80%' border='0' style='border-collapse: collapse' cellpadding='0' cellspacing='0' >
<tr>
<td colspan='3'><img src='pack_map/1.png' width='100%' height='100%'></td> </tr>
<tr>
<td id="td_1" align='left' valign="top" width='60%' height='20%'><img src='pack_map/2.jpg' width='100%' height='100%'></td>
<td id="td_2" align='left' width='13%' ><img src='pack_map/5.jpg' width='100%' height='100%'></td>
<td id="td_3" align='left' width='30%' ><img src='pack_map/4.jpg' width='100%' height='100%'></td>
</tr>
<tr>
<td align='left' width='50%' colspan='2'><img src='pack_map/8.jpg' width='100%' height='100%'></td>
<td align='left' width='30%' ><img src='pack_map/7.jpg' width='100%' height='100%'></td>
</tr>
<tr>
<td id="td_4" align='left' width='60%' height='20%' ><img src='pack_map/3.jpg' width='100%' height='100%'></td>
<td id="td_5" align='left' width='13%' ><img src='pack_map/6.jpg' width='100%' height='100%'></td>
<td id="td_6" align='left' width='30%' ><img src='pack_map/3.png' width='100%' height='100%'></td>
</tr>
</table>
第二种
var tabl = document.getElementById("tabl").rows[0].cells[0].offsetWidth;
这种是可以特定的找到第几行,第几列的宽。
上面说的只是宽,对于其他属性,颜色,高度,等等,都可以用这种方法获取。
如何用 js 获取table 或者其他块状标签的 宽和高的更多相关文章
- 如何用JS获取页面上的所有标签
最近忙的一匹,忙着大保健,都来不及写博客,今天特意抽出点时间来写一写 前两天看到一个题,是问如何从页面上获取所有的标签的并查看他们的数量,感觉还是有点意思的,所以给大家来搞一下子 我们先来捋捋思路,那 ...
- 【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数
一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...
- JS获取table表格任意单元格值
jsp页面表格布局 <body onload="show()"> <center> <input type="text" valu ...
- js获取table的值,js获取td里input的值
1.如果想让table具有可以编辑的功能,可以在table里嵌入input标签 写法{{ list_one[1] or '' }}的作用是,当list_one[1]取值为None时,前端web界面不至 ...
- 如何用js获取日期(转载)
本文介绍了js获取日期的方法,可以获取前天.昨天.今天.明天.后天. 代码: <html> <head> <meta http-equiv="Content-T ...
- jquery、js获取table,遍历输出tr中各个td的内容。
首先,依赖jquery.. $('#btntb').click(function(){ $('#tab tr').each(function(i){ // 遍历 tr $(this).children ...
- js获取table checkbox选中行的值.mdjs获取table checkbox选中行的
<!DOCTYPE html> <html> <head> <script src="https://cdn.staticfile.org/jque ...
- 如何用JS获取ASP.net中的textbox的值 js获不到text值
<tr> <td class="table_body" style="width: 10%" a ...
- 如何用js获取浏览器URL中查询字符串的参数
首先要知道Location这个对象以及这个对象中的一些属性: href:设置或返回完整的url.如本博客首页返回http://www.cnblogs.com/wymninja/ host:设置或返回主 ...
随机推荐
- vue-cli 路由 实现类似tab切换效果(vue 2.0)
1,更改main.js 2,在App.vue中,写入两个跳转链接(router-link),分别跳转到"home""About" (home.About即分别是 ...
- input框focus时的美化效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- c# GridControl怎么换行
百度找到的答案 1.ColumnEdit 增加 MemoEdit2.AppearanceCell-TextOptions- WordWrap3.OptionsView RowAutoHeight
- 初涉深度优先搜索--Java学习笔记(二)
版权声明: 本文由Faye_Zuo发布于http://www.cnblogs.com/zuofeiyi/, 本文可以被全部的转载或者部分使用,但请注明出处. 上周学习了数组和链表,有点基础了解以后,这 ...
- 为什么要重写hashcode() 方法
Java中的集合(Collection)有两类,一类是List,再有一类是Set. 前者集合内的元素是有序的,元素可以重复:后者元素无序,但元素不可重复. 那么我们怎么判断两个元素是否重复呢? 这就是 ...
- F.I.S初探(前端工程化)
云笔记:http://note.youdao.com/share/?id=7c4a2dcf118f0ad7bb52a36aaee46a7a&type=note 一.初识FIS 在做项目中遇 ...
- Verlet-js JavaScript 物理引擎
subprotocol最近在Github上开源了verlet-js.地址为https://github.com/subprotocol/verlet-js.verlet-js是一个集成Verlet的物 ...
- Mongodb 学习笔记
Mongo DB NoSql简介 MongoDB简介 在Windows平台下安装Mongo Mongo DB官方文档 MongoDB基本命令 MongoDB的默认安装路径为 C:\Program Fi ...
- Windows Azure Storage (6) Windows Azure Storage之Table
<Windows Azure Platform 系列文章目录> 最近想了想,还是有必要把Windows Azure Table Storage 给说清楚. 1.概念 Windows Azu ...
- angularjs中的directive scope配置
angularjs中的directive scope配置 定义directive其中重要的一环就是定义scope,scope有三种形式: 默认的scope,DOM元素上原有的scope scope: ...