Java Script基础（七） HTML DOM模型
一、HTML DOM。
HTML DOM的特性和方法是专门针对HTML的，HTML中的每个节点都是一个对象，通过访问属性和方法的方式，让一些DOM操作更加简便，在HTML DOM中有专门用来处理白哦个及其元素的属性和方法。
下面以Table为例来讲解HTML DOM动态操作表格。
1、Table对象（表格）
在HTML DOM中， table对象代表一个HTML表格，TableRow对象代表HTML表格的行，tableCell对象代表HTML表格的单元格。在HTML中可以通过Table、TableRow和TableCell来创建HTML表格。
属性：
rows[]：获取表格中的所有行。
cellls[]：获取表格中的所有单元格。
方法：
inertRow(index)：用于在表格的指定位置插入一个新行。
deleteRow(index)：用于从表格中删除指定位置的行。
2、TableRow对象（行）
属性：
cells[]：返回当前行中的所有单元格。
rowIndex：返回当前行的下标。
方法：
insertCell(index)：在一行中的指定位置插入单元格。
deleteCell(index)：删除一行中指定位置的单元格。
3、TableCell对象（单元格）
属性：
cellIndex：返回当前单元格所在的下标
innerHTML：返回当前单元格中的HTML标记。
align：设置单元格的水平对齐方式。
className：设置单元格的class属性。
示例：
动态生成单元格的行，并为单元格赋值。
<html>
<head>
<script type="text/javascript">
function insRow()
{
var x=document.getElementById('myTable').insertRow(0)
var y=x.insertCell(0)
var z=x.insertCell(1)
y.innerHTML="NEW CELL1"
z.innerHTML="NEW CELL2"
}
</script>
</head> <body>
<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
<tr>
<td>Row3 cell1</td>
<td>Row3 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="insRow()" value="插入行"> </body>
</html>
Java Script基础（七） HTML DOM模型的更多相关文章
- Java script基础
Java script基础 Js的每个语句后面都要有分号. <script type="text/java script">所有JS内容</script> ...
- Java Script 基础
一. JS的简介 JavaScript是一种网页编程技术,经常用于创建动态交互网页 JavaScript是一种基于对象和事件驱动的解释性脚本语言,类似C语言和Java的语法 事先不编译:逐行执行:无需 ...
- Java Script基础（六） DOM模型
一.文档对象模型 DOM( Document Object Model)文档对象模型,它提供了访问.动态修改文档的借口,W3C指定了DOM规范,主流浏览器都支持.DOM由3部分组成,分别是CoreDo ...
- Java Script基础（四） BOM模型
一.BOM模型 BOM模型(Browser Object Model),也称为文档对象模型,它包含浏览器相关的属性和方法,例如操作,前进后退按钮,控制地址栏,关闭浏览器窗口,打开新窗口等等.它包含的对 ...
- Java Script 基础总结
1学习ajax需要一点CSS的基础和JavaScipt基础 今天重温一下Javascrpt基础 1.<script type="text/javascript">< ...
- Java Script基础（一）
一.为什么学习JavaScript 学习JavaScript主要有以下两点原因. 1.客户端表单验证. 2.实现页面交互(网页特效) 二.什么是JavaScript JavaScript是一种描述语言 ...
- Java Script基础（十） 访问样式表
动态控制样式表 在JavaScript中,有两种方式可以动态的改变样式属性,一种是使用style属性,另一种是使用样式的className属性.另外控制元素隐藏和显示使用display属性. 1.使用 ...
- Java Script基础（九） 下拉列表对象
Select下拉列表 属性: options[]:返回包含下拉列表中的所有选项的一个数组. selectedIndex:设置返回下拉列表中被选项目的索引号. length:返回下拉列表框中选项的数目. ...
- Java Script基础（八） Array数组对象
一.Array数组 JavaScript中的数组也是具有相同数据类型的一个或者多个值得集合.用法和Java中的数组类似. Array对象的常用属性和方法: 属性: length:获取数组的长度: 方法 ...
随机推荐
- SOA和Web Service介绍
博客园中关于SOA和Web Service的介绍 http://www.cnblogs.com/talentbuilder/archive/2010/05/04/1727044.html http:/ ...
- 关于Unity
14年左右的时候开始学习了Unity,一直没有时间总结一些东西,框架机制啥的都不用说了,网上到处都有,虽然Unity是脚本机制,但是熟悉编程的人只要理解透了拿面向对象的思维编码也完全没有问题,这里重新 ...
- Map排序——按key排序，按value排序
注:转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/5959279.html 上一篇博文谈到了集合类的自定义排序方式,那么进一步扩展开来,与集合同等重要的Map有 ...
- java中Arrays类中，binarySearch()方法的返回值问题
最近在复习Java知识,发现果然不经常使用忘得非常快... 看到binarySearch()方法的使用时,发现书上有点错误,于是就自己上机实验了一下,最后总结一下该方法的返回值. 总结:binaryS ...
- ENTBOOST 2014.180L 发布，开源企业IM免费企业即时通讯
ENTBOOST,VERSION 2014.180 Linux版本发布,主要增加企业IM应用集成功能,完善安卓SDK功能及部分BUG修正: 7/1(明天)发布Windows版本,敬请关注! ENTBO ...
- Beyond Compare3 添加到右键菜单
Beyond Compare 是个优秀的工具,我们经常用于对比文件和文件夹,右键点点就可以调用对比,着实很方便.但从3.2版本之前,我们可以从设置中将bc关联到文件夹和文件右键,但之后的版本已经找不到 ...
- WAF指纹探测及识别技术<freebuf>
Web应用防护系统(也称:网站应用级入侵防御系统.英文:Web Application Firewall,简称: WAF).利用国际上公认的一种说法:Web应用防火墙是通过执行一系列针对HTTP/HT ...
- Android Volley框架的使用（三）
此博文源码下载地址 https://github.com/Javen205/VolleyDemo.git Image Request 为了更方便的使用Volley中的图片请求,我们同样先在Voll ...
- Codeforces Round #181 (Div. 2) B. Coach 带权并查集
B. Coach 题目连接: http://www.codeforces.com/contest/300/problem/A Description A programming coach has n ...
- YouTube上的版权保护
早在2007年的时候,我曾写过一篇名为“YouTube: The Big Copyright Lie”(YouTube:关于版权的弥天大谎)的文章,表达了我对YouTube又爱又恨的情感纠结: 现在回 ...