`

自己动手-修改表格内容

JavaScriptXHTMLJ#HTML 
阅读更多 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<table width="200" border="1" id="nameList">
    <tr>
        <td>茶叶</td>
        <td>茶叶</td>
        <td>茶叶</td>
    </tr>
    <tr>
        <td>茶叶</td>
        <td>茶叶</td>
        <td>茶叶</td>
    </tr>
    <tr>
        <td>茶叶</td>
        <td>茶叶</td>
        <td>茶叶</td>
    </tr>
</table>
<p>
    <input type="submit" name="button" id="button" value="修改内容" onclick="changeTableData();"/>
</p>

<script type="text/javascript">
function changeTableData(){
	var nameListTable=document.getElementById("nameList");
	//获得表格行数
	var tbRows=nameListTable.rows;
	var rowsLen=tbRows.length;
	for ( var i = 0; i < rowsLen; i++) {
		//获得每行单元格个数
		var cellsLenPerRow=tbRows[i].cells.length;
		for ( var j = 0; j < cellsLenPerRow; j++) {
			tbRows[i].cells[j].innerHTML="macrotea";
		}
	}
}
</script>
</body>
</html>

 

分享到：
| Javascript事件
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    实验2-表格UI设计实验.docx

    - **表格按照H5的标准编写**：使用`&lt;thead&gt;`、`&lt;tfoot&gt;`、`&lt;tbody&gt;`等标签来组织表格内容，这有助于提高表格的语义性和可访问性。 - **表格奇偶行颜色不同**：通过`:nth-child(even)`和`:nth-child(odd)`伪类选择...

    自己动手实现JQUERY动态表格需要的拿去。 附件下载可以直接运行看效果!

    在这个"自己动手实现JQUERY动态表格"的项目中，我们可以深入理解如何利用jQuery来动态创建、修改和操作HTML表格。 首先，我们需要了解jQuery的基本用法。jQuery的核心函数`$`用于选择DOM元素，然后可以对这些元素...

    js表格操作，DOM实现数据动态增删查改

    这可能需要找到对应的`&lt;td&gt;`元素并修改其内容。 7. **事件处理**：在JavaScript中，我们使用`addEventListener()`来注册事件处理函数。例如，为“添加”按钮添加点击事件，为表格行添加点击事件等。 8. **优化性能...

    vue-easytable@2.16.3版本 拖动列 动态改变列宽大小实现

    vue-easytable表格老版本有表格列宽拖功能，但是最新版插件反而不存在该功能，但是大部分表格数据存在长短不一，导致表格很难看，为了解决这种问题，只能自己动手做了。该功能如何实现，我会在资源内详细说明，如果...

    动手实践-2.zip

    2. **HTML基础知识**：HTML的基本元素、属性和结构，如标签、类选择器、ID选择器，以及如何组织网页内容，创建链接、图片和表格等。 3. **网页开发**：HTML与CSS、JavaScript的关系，如何使用它们共同构建动态、...

    用jQuery自己写的一个表格——jQuery菜鸟入门，希望和大家一起学习

    本文将围绕“用jQuery自己写的一个表格”这一主题，深入讲解如何利用jQuery来创建自定义的表格，并以此作为jQuery初学者的学习起点。 首先，我们需要了解表格在HTML中的基本结构。一个简单的表格由`&lt;table&gt;`标签...

    老二牛车Axure夜话：中继器系列视频教程之中继器表格修改带图像数据

    《老二牛车Axure夜话：中继器系列视频教程之中继器表格修改带图像数据》 在本文中，我们将深入探讨Axure RP这款强大的原型设计工具中的一个重要功能——中继器（Repeater）。中继器是Axure中用于创建动态、可交互...

    AMESim表格数据导入方法--经常用到.rar_Amesim存数据_Amesim怎么查表_amesim中的数表_amesim表

    当你在模型中添加了一个数表，你可以双击它打开编辑器，这里你可以看到并修改表中的数据。同时，AMESim允许你链接外部数据源，例如Excel文件，这样当Excel数据更新时，AMESim中的数表也会同步更新。 "amesim中的数...

    Auntion TableSort(最新修改,支持Float,支持锁定不排序行)

    继续网上搜索，仍然没有找到合适的答案，为了适应要求，特自己动手修改如下，也方便大家， 望指教. 1、修正一个Float类型数据排序问题，老版本把Float当String排序了。 2、增加一个锁定合计栏不参与排序的功能 ...

    JQuery表格拖动调整列宽效果(自己动手写的)

    最近比较空闲，便自己动手尝试实现，在此分享下小小的成果。 首先需要如图所示的鼠标图标文件，在自己的硬盘中搜索*.cur，肯定能找到。 为了能在所有需要该效果的页面使用，并且不需要更改页面任何HTML，我把所有的...

    WPS表格和Excel分栏

    工作中需要对excel的海量数据进行分栏，百度经验里提供了一种手工操作方式不适用海量数据，于是自己动手开发，用C#调用office接口实现了该功能，后来又需要在wps表格中实现该功能，略做了修改，可在.net framework...

    xls表格转化为易语言edb数据库

    3. 易语言Excel工作簿组件：这是易语言提供的一种组件，用于与Excel文件进行交互，可以读取、修改Excel数据。通过这个组件，程序员可以在易语言程序中打开、操作和保存Excel文件。 4. 外部数据库组件：易语言支持...

    自己动手写操作系统

    "自己动手写操作系统"这本书旨在帮助读者深入理解操作系统的原理，并通过实践来编写自己的操作系统。书中的源代码提供了实现这些概念的实际示例。 汇编语言是与计算机硬件紧密相连的编程语言，它是编写操作系统的...

    智能家居系统 表格布局TableLayout.doc

    - 学生进行实践操作，创建和修改自己的TableLayout实例。 - 最后进行课堂总结，回顾学习要点，解答学生疑问。 通过这样的教学流程，学生不仅能理解表格布局的特性，还能掌握其实际应用技巧，为构建智能家居系统或...

    AutoCAD 2015从入门到精通视频教程下载第06章 文字和表格.zip

    - **编辑文字**：包括修改文字内容、调整文字高度、宽度和旋转角度。还可以对文字进行对齐、镜像、偏移等操作。 - **文字块与属性**：学习如何创建文字块，用于标准化常用文本，以及理解属性文字的概念，如动态块...

    漂亮的表格.rar

    4. DOM操作：学习如何使用JavaScript操作DOM（Document Object Model）来动态修改表格内容。 5. AJAX：理解异步请求的工作原理，以及如何使用XMLHttpRequest或fetch API获取和更新表格数据。 6. JavaScript库和框架...

    python实例31-用Python设置Word文档里表格的格式.rar

    Python提供了几个库，如`python-docx`，使我们能够轻松地读取、创建和修改Word文档。`python-docx`是一个非常强大的库，它允许开发者以编程方式与Word文档进行交互。 首先，你需要安装`python-docx`库。这可以通过...

    Javascript表格高级操作

    在JavaScript编程中，表格是一种常见的数据展示方式，用于呈现结构化的信息。在“Javascript表格高级...记住，实践是检验理论的最好方式，所以动手尝试这些操作，将有助于加深理解和掌握JavaScript表格操作的核心概念。

    易语言自动制作文本表格源码-易语言

    易语言是一种专为中国人设计的编程语言，它以...同时，尝试自己动手修改源码，比如改变表格的样式、处理更复杂的数据结构，是提升编程技能的好方法。记住，实践是检验理论的最好方式，所以不要害怕动手去试错和学习。

    易语言滴答表格树型操作源码.zip易语言项目例子源码下载

    易语言是一种基于中文编程的计算机程序设计语言，旨在降低编程技术门槛，让更多人能够接触和学习编程。...记得在学习过程中动手实践，通过修改和调试代码，加深对这些技术的理解，这将对你的编程事业大有裨益。

Magicbox
Global site tag (gtag.js) - Google Analytics