一、HTML DOM。

  HTML DOM的特性和方法是专门针对HTML的,HTML中的每个节点都是一个对象,通过访问属性和方法的方式,让一些DOM操作更加简便,在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模型的更多相关文章

  1. Java script基础

    Java script基础 Js的每个语句后面都要有分号. <script  type="text/java script">所有JS内容</script> ...

  2. Java Script 基础

    一. JS的简介 JavaScript是一种网页编程技术,经常用于创建动态交互网页 JavaScript是一种基于对象和事件驱动的解释性脚本语言,类似C语言和Java的语法 事先不编译:逐行执行:无需 ...

  3. Java Script基础(六) DOM模型

    一.文档对象模型 DOM( Document Object Model)文档对象模型,它提供了访问.动态修改文档的借口,W3C指定了DOM规范,主流浏览器都支持.DOM由3部分组成,分别是CoreDo ...

  4. Java Script基础(四) BOM模型

    一.BOM模型 BOM模型(Browser Object Model),也称为文档对象模型,它包含浏览器相关的属性和方法,例如操作,前进后退按钮,控制地址栏,关闭浏览器窗口,打开新窗口等等.它包含的对 ...

  5. Java Script 基础总结

    1学习ajax需要一点CSS的基础和JavaScipt基础 今天重温一下Javascrpt基础 1.<script type="text/javascript">< ...

  6. Java Script基础(一)

    一.为什么学习JavaScript 学习JavaScript主要有以下两点原因. 1.客户端表单验证. 2.实现页面交互(网页特效) 二.什么是JavaScript JavaScript是一种描述语言 ...

  7. Java Script基础(十) 访问样式表

    动态控制样式表 在JavaScript中,有两种方式可以动态的改变样式属性,一种是使用style属性,另一种是使用样式的className属性.另外控制元素隐藏和显示使用display属性. 1.使用 ...

  8. Java Script基础(九) 下拉列表对象

    Select下拉列表 属性: options[]:返回包含下拉列表中的所有选项的一个数组. selectedIndex:设置返回下拉列表中被选项目的索引号. length:返回下拉列表框中选项的数目. ...

  9. Java Script基础(八) Array数组对象

    一.Array数组 JavaScript中的数组也是具有相同数据类型的一个或者多个值得集合.用法和Java中的数组类似. Array对象的常用属性和方法: 属性: length:获取数组的长度: 方法 ...

随机推荐

  1. [MySQL] 字符集和排序方式

    字符串类型 MySQL的字符串分为两大类: 1)二进制字符串:即一串字节序列,对字节的解释不涉及字符集,因此它没有字符集和排序方式的概念 2)非二进制字符串:由字符构成的序列,字符集用来解释字符串的内 ...

  2. MVC ajax 上传文件

    废话不多说,上代码: 用到的js文件: jquery.min.js jquery.easyui.min.js <input id="fileurl" onclick=&quo ...

  3. iOS开发-HTTP请求

    什么是URL?URL就是资源的地址.位置,互联网上的每个资源都有一个唯一的URLURL的基本格式: URL中常见的协议 (1)HTTP 超文本传输协议,访问的是远程的网络资源,格式是http:// h ...

  4. yum命令的使用

    yum源的配置,请参考此文:RedHatLinux 本地yum源的配置.本文讲解如何使用yum命令. [root@serv01 ~]# yum --help Loaded plugins: produ ...

  5. 让python整型计算结果为浮点型

    这是个入门知识,我记录下. 在python中,默认情况下,如果表达式中全是整型,结果也会仅仅是整型.有时候没注意会出现意想不到的结果,比如: >>> a = 7 >>&g ...

  6. 你应该知道的JavaScript中NaN的秘密

    NaN,不是一个数字,是一种特殊的值来代表不可表示的值,使用typeof或其他任何与之比较的处理方式,‘NaN’则会引起一些混乱, 一些操作会导致NaN值的产生.这里有些例子: Math.sqrt(- ...

  7. 多个非同源的shared_ptr管理对象引起double free

    有多个不同源的shared_ptr管理对象时会出现多次释放对象,这里不同源是指多组间不是通过拷贝构造.复制等手段而来的,即几组shared_ptr是独立声明的. #include<iostrea ...

  8. [CSS] Introduction to CSS Columns

    Learn how to use CSS columns to quickly lay out fluid columns that are responsive, degrade gracefull ...

  9. iOS开发——UI篇Swift篇&UIDatePicker

    UIDatePicker //返回按钮事件 @IBAction func backButtonClick() { self.navigationController?.popViewControlle ...

  10. WebService究竟是什么?

    一.序言 大家或多或少都听过WebService(Web服务),有一段时间非常多计算机期刊.书籍和站点都大肆的提及和宣传WebService技术,当中不乏非常多吹嘘和做广告的成分.可是不得不承认的是W ...