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:获取数组的长度: 方法 ...
随机推荐
- A Dream
A Dream 2013年10月20日,成都,天气阴,铜牌16.离2012年10月14日长春现场赛刚好隔了一年,刚看了下去年写的总结http://blog.csdn.net/cc_again/arti ...
- SQL Server 2008 无法保存表的更改
MS SQL Server 2008 在建完表后,如果要重新设计表,如修改字段长度,就会提示:“当用户在在SQL Server 2008企业管理器中更改表结构时,必须要先删除原来的表,然后重新创建新表 ...
- 关于刘冬大侠Spring.NET系列学习笔记3的一点勘正
诚如他第22楼“只因渴求等待”提出的疑问一样,他的下面那一段代码是存在一点点问题的, XElement root = XElement.Load(fileName); var objects = fr ...
- 12.组合(Composition)
组合也是关联关系的一种特例,它体现的是一种contains-a的关系,这种关系比聚合更强,也称为强聚合:它同样体现整体与部分间的关系,但此时整体与部分是不可分的,它们具有统一的生存期,整体的生命周期结 ...
- codis3.1集群搭建
Codis31搭建 codis 3.1 安装搭建 一.基本信息 1. 服务器基本信息 ip地址 安装服务 172.16.200.71 zk1.codis-dashboard.codis-fe.codi ...
- iOS开发-基本的网络知识
一.HTTP协议的主要特点:(摘自 仰望星空 的博客)重点内容 1. CS模式 2. 简单快速:只需要传送请求方法和路径.(常用方法有GET,HEAD,POST) 3. 灵活:任意对象都可以,类型由C ...
- Setting up Nutch 2.1 with MySQL to handle UTF-8
原文地址: http://nlp.solutions.asia/?p=180 These instructions assume Ubuntu 12.04 and Java 6 or 7 instal ...
- Microsoft SQL Server 2008 基本安装说明
Microsoft SQL Server 2008 基本安装说明 安装SQL2008的过程与SQL2005的程序基本一样,只不过在安装的过程中部分选项有所改变,当然如果只熟悉SQL2000安装的同志来 ...
- This implementation is not part of the Windows Platform FIPS validated cryptographic algorithms. 此实现不是 Windows 平台 FIPS 验证的加密算法的一部分 解决方案
但web启用了md5加密后 有可能出现这样的错误 This implementation is not part of the Windows Platform FIPS validated cryp ...
- 用JSP实现的商城购物车模块
这两天,在学习JSP,正好找个小模块来练练手: 下面就是实现购物车模块的页面效果截图: 图1. 产品显示页面 通过此页面进行产品选择,增加到购物车 图2 .购物车页面 图3 . 商品数量设置 好了,先 ...