在IE和FF下稍有不同:
<!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>
<title></title>
<script type="text/javascript">
//code from NC01 http://forums.asp.net/t/1395561.aspx
function getTableColumnValue(tableId, rowNumber, columnNumber) {
var tableRef = document.getElementById(tableId);
var elementRef = tableRef.rows[rowNumber].cells[columnNumber];
var elementValue = '';
if (elementRef.textContent) {
// Firefox
elementValue = elementRef.textContent;
}
else if (elementRef.innerText) {
// IE
elementValue = elementRef.innerText;
}
else {
// Default
elementValue = elementRef.innerHTML;
var regExp = /<\/?[^>]+>/gi;
elementValue = elementValue.replace(regExp, '');
}
//alert(elementValue);
return elementValue;
}
</script>
</head>
<body>
<table border="1" id="myTable">
<tr>
<td>
aa
</td>
<td>
bb
</td>
<td>
cc
</td>
</tr>
<tr>
<td>
dd
</td>
<td>
ee
</td>
<td>
ff
</td>
</tr>
<tr>
<td>
gg
</td>
<td>
hh
</td>
<td>
ii
</td>
</tr>
</table>
<input type="button" value="click" onclick="this.value=getTableColumnValue('mytable',1, 2);">
</body>
</html>
分享到:
相关推荐
### JavaScript 实现 HTML Table 单元格合并及隐藏列功能详解 #### 一、背景介绍 在处理 HTML 表格时,我们经常会遇到需要合并相同数据的单元格以及根据需求显示或隐藏某些列的情况。例如,在报表展示或者数据汇总...
在表格(Table)设计中,有时我们需要合并单元格来达到特定的展示效果,例如创建标题行或列,或者为了美观和布局对齐。在HTML、CSS以及JavaScript中,都有多种方式可以实现单元格的合并。这里我们将详细探讨六种合并...
Table前端同一列里面内容相同的单元格合并,网上找的存在如下问题: 1、大部分只能合并某一列,不能多列; 2、有些能合并多列的,首列合并后,第二列合并单元格行数不能超过首列合并的单元格行数,虽然第二列值可能...
综上所述,HTML中的`<table>`不仅可以用于展示数据,还可以通过巧妙的方式在单元格内绘制斜线。理解并掌握这些技巧,可以让你在Web开发中更加得心应手。通过实践和不断学习,你可以创造出更加美观且功能丰富的HTML...
这里我们简单地模拟一下这个过程,将新的单元格值保存到JavaScript数组中。 ```javascript function updateDataSource(cell, newValue) { var rowIndex = cell.parent().index(); // 获取行索引 var colIndex = ...
如果需要处理特定列的数据,可以使用`cellIndex`属性确定当前单元格在行中的位置。 五、示例代码 ```javascript // 获取所有复选框 const checkboxes = document.querySelectorAll('table input[type="checkbox"]'...
通过以上步骤,就可以在Vue项目中使用Element UI的表格组件,并在table-cell单元格中绘制微型的ECharts图表,实现数据的可视化展示。需要注意的是,实际开发过程中可能需要根据实际的数据结构和样式需求进行相应的...
本篇文章将详细讲解如何在`table-cell`单元格内绘制微型ECharts图,以满足此类需求。 首先,ECharts是一个优秀的JavaScript可视化库,它提供了丰富的图表类型和强大的交互功能。在Vue项目中,我们可以利用ECharts的...
在JavaScript编程中,将HTML的表格(`<table>`元素)转换为可编辑表格是一项常见的需求,这可以增强用户交互性,允许用户直接在页面上修改数据。本教程将详细介绍如何实现这一功能,并提供一个调用示例,帮助开发者...
在HTML中,table由`<table>`标签定义,每一行由`<tr>`标签表示,而每一列则由`<td>`(表格数据)或`<th>`(表头数据)标签表示。在JavaScript中,我们可以使用DOM操作或者jQuery库来实现这个功能。 **纯JavaScript...
本文将深入探讨如何使用JavaScript来操作HTML中的表格元素,包括获取单元格、行的数据以及各种属性。 首先,我们需要了解HTML表格的基本结构,它由`<table>`、`<tr>`(行)、`<th>`(表头)和`<td>`(数据单元格)...
#### 四、遍历HTML中的Table 了解了以上知识后,我们可以编写函数遍历表格的每一行和每一列,提取所需的数据。 ```javascript function accessAllTable(objTab) { for (var i = 0; i ; i++) { for (var j = 0; j...
创建一个基础的`vxe-table`,需要在模板中设置表格的结构和数据。以下是一个简单的例子: ```html <vxe-table :align="allAlign" :data="tableData"> <vxe-table-column type="seq" width="60"></vxe-table-...
首先,让我们从基础开始,了解如何在HTML中创建一个基本的表格。HTML的`<table>`标签用于定义表格,`<tr>`定义行,`<th>`定义表头,而`<td>`则定义数据单元格。例如: ```html <table> 表头1 表头2 数据1 ...
本文将详细介绍如何在Vue中使用Element-UI的`el-table`组件来合并上下两行相同数据的单元格。 首先,我们需要在HTML模板中设置`el-table`组件。在以下示例中,我们定义了一个表格,包含四个列(项目名称、污染区段...
在Web开发中,使用JavaScript实现HTML表格(table)单元格的点击展开和隐藏效果是一个常见的需求,这通常用来实现如详细信息的查看和收起功能。本文将详细解读如何使用JavaScript及jQuery库来实现该效果。 首先,要...
`el-table`接受`data`属性来绑定数据源,`border`属性用于添加边框样式,而`style="width: 100%"`则设置表格宽度为100%以占据容器的全部宽度。 ```html <el-table :data="tableData" border style="width: 100%"> `...
在JavaScript编程中,合并单元格是一项常见的需求,特别是在处理HTML表格时。这通常涉及到优化数据展示,例如在报告或统计中避免重复信息占用过多空间。本文将深入探讨如何使用JavaScript来实现相同内容的单元格合并...
在HTML中,表格由`<table>`元素创建,其中包含`<tr>`(行)元素,`<th>`(表头单元格)和`<td>`(数据单元格)。表格可以通过`<thead>`,`<tbody>`和`<tfoot>`元素来组织结构,分别代表表头、主体和表脚。 2. **...
在JavaScript(JS)开发中,动态地从JSON(JavaScript Object Notation)数据中读取信息并将其呈现到HTML表格(table)中是一项常见的任务。JSON因其简洁、易读且易于处理的特性,常用于存储和交换结构化数据。在这...