HTML Dom操作数据表
在QTP中有时候使用HTML Dom会带来事半功倍的效果,比如访问页面元素对象,对元素对象进行定位和获取属性值等,最近开始学HTML Dom的一些方法,属性,事件,修改等。
下面是通过HTML Dom操作页面表格,具体实现是:
1. 输入想要删除的行和列
2. 点击获得行列按钮,弹出提示框显示要删除的行列
3. 点击删除按钮,表格中相应的单元格中的数据被清空
-----------------------分割线----------------------------------------------------------------------------
运行前的表格截图:

运行后的表格截图:

源码包含两个函数sub()和deleteCell(),sub()用来显示要删除的行列,deleteCell()用来删除行列。
<!DOCTYPE html> <html> <head> <script>
function sub(){ var content1 = document.getElementById("row"); var content2 = document.getElementById("col"); row = content1.value - 1; col = content2.value - 1; alert("RowNo is:"+row+",and ColNO is:"+col); } function deleteCell() { var i=document.getElementById("row").value-1; var j=document.getElementById("col").value-1; el=document.getElementById('myTable'); var row=el.rows(i); var cell=row.cells(j) cell.innerText="" } </script> </head> <body>
<table id="myTable" border="1"> <tr> <td>cell 1</td> <td>cell 2</td> <td>cell a</td> <td>cell b</td> </tr> <tr> <td>cell 3</td> <td>cell 4</td> <td>cell a</td> <td>cell b</td> </tr> <tr> <td>cell 5</td> <td>cell 6</td> <td>cell a</td> <td>cell b</td> </tr> <tr> <td>cell 7</td> <td>cell 8</td> <td>cell a</td> <td>cell b</td> </tr> <tr> <td>cell 9</td> <td>cell 10</td> <td>cell a</td> <td>cell b</td> </tr> </table> <br> <input type="button" onclick="sub()" value="GetRowValue"> <form> Row <input type="text" Id="row"><br> Col <input type="text" Id="col"> </form>
<input type="button" onclick="deleteCell()" value="DeleteRow"> </body> </html>
HTML Dom操作数据表的更多相关文章
- MYSQL操作数据表中的记录
36:操作数据表中的记录插入记录 INSERT INTO 表名 VALUES(); 或者INSERT 表名 VALUES(); UPDATE更新记录(单表更新) DELETE删除记录( ...
- 操作数据表中的记录——SELECT (where表达式、GROUP BY、HAVING、LIMIT)
原文链接:http://www.ifyao.com/2015/01/26/%E6%93%8D%E4%BD%9C%E6%95%B0%E6%8D%AE%E8%A1%A8%E4%B8%AD%E7%9A%84 ...
- MySQL 命令操作数据表
MySQL 命令操作数据表 1.查看表信息 desc hs_user_credit_info; 2.新增表字段 alter table hs_credit_order add search_relat ...
- MySQL学习之路(二)——数据类型和操作数据表
数据类型和操作数据表 2.1 MySQL类型之整型 2.2 MySQL数据类型之浮点型 2.3 日期时间型 DATE 1支持时间:1000年1月1日~9999年12月31日 DATETIME 3 支持 ...
- MySQL入门(4)——操作数据表
MySQL入门(4)--操作数据表 创建数据库 CREATE [TEMPORARY] TABLE [IF NOT EXISTS] 数据库名 [(create_definition,...)] [tab ...
- javascript学习笔记之DOM与表单
DOM(文档对象模型),猫叔了一个层次化的节点树 一.DOM NODE相关公共属性与方法 DOM中所有节点都实现了NODE接口,该接口的公共属性和方法如下: 1.节点基本属性 1)NodeType 节 ...
- 【JavaScript】DOM之表单操作
DOM 表单操作 1.获取表单 获取表单元素 以Document对象中forms属性来获取当前HTML页面所有表单集合以Document对象中表单的name属性值来获取表单元元素 <body&g ...
- sql server 2008 操作数据表
SQL Server表 表的类型: ①临时表 临时表可用来处理中间数据或者用临时表 与其它连接共享进行中的工作.临时表只 能放在tempdb中. 私有临时表(#) 全局临时表(##) ②系 ...
- MySQL之数据类型与操作数据表
上节回顾 一.数据类型 什么是数据类型? 数据类型是指列.存储过程参数.表达式和局部变量的数据特征,它决定了数据的存储格式,代表了不同的信息类型. 所谓数据类型,最直接的理解就是我们有些是存储数字的, ...
随机推荐
- Winform常用开发模式第一篇
Winform常用开发模式第一篇 上一篇博客最后我提到“异步编程模型”(APM),之后本来打算整理一下这方面的材料然后总结一下写篇文章与诸位分享,后来在整理的过程中不断的延伸不断地扩展,发现完全偏离了 ...
- WebView 实现MiniBrowser
package org.hjw.minibrowser; import android.os.Bundle; import android.app.Activity; import android.v ...
- [置顶] MyElipse9.0 M1安装svn(测试100%通过)
为什么标题要写100%通过呢?原因是以前的方法(直接复制到plugin里(MyEclipse 6.0可以,我试过),link安装)都不好用了,9.0M1不吃这一套,所以告诉大家这么做一定能够装上!! ...
- 2440裸机驱动之PWM开发
原文http://blog.chinaunix.net/uid-14114479-id-3125685.html ARM驱动蜂鸣器的方式有两种:一种是PWM输出口直接驱动,另一种是利用IO定时翻转电平 ...
- [置顶] Android图片异步加载之Android-Universal-Image-Loader
将近一个月没有更新博客了,由于这段时间以来准备毕业论文等各种事务缠身,一直没有时间和精力沉下来继续学习和整理一些东西.最近刚刚恢复到正轨,正好这两天看了下Android上关于图片异步加载的开源项目,就 ...
- 捕鱼达人代码例子下载地址 Win版
捕鱼达人代码例子下载地址 Win版:: http://pan.baidu.com/share/link?shareid=1601576904&uk=3189484501
- 用浅/深拷贝、和HTML5方法解决js对象的引用的问题
先来看一个例子 例一: var a=[1,2,3]; var b=a; b.push(4); alert(b);//1,2,3,4 alert(a);//1,2,3,4 var a=[1,2,3]; ...
- JS设计模式之观察者模式
观察者模式,即发布与订阅模式,实现一对多的一种关系模式,当一种对象接受信号时其他所有依赖均有行为.我们在写code的时候总是会去自定义一些事件,这就是观察者常常使用的地方: JS中的观察者模式应用: ...
- Day1-python理论基础
一.python介绍 Python 的创始人为Guido van Rossum.Guido为了打发圣诞节的无趣,于1989年发明,在荷兰国家数学和计算机科学研究所设计出来的(作为ABC 语言的一种继 ...
- Linux之初体验
预备作业03--我的Linux初体验 学习基于VirtualBox虚拟机安装Ubuntu图文教程在自己笔记本上安装Linux操作系统 一开始以为这个项目很简单,以往也在自己的笔记本上看教程安装过软件, ...