`

js获取table中鼠标点的行号和内容

JavaScriptHTML 
阅读更多 
<html> 
<head> 
<script language="javascript"> 
function doclick() 
{ 
var td = event.srcElement; // 通过event.srcElement 获取激活事件的对象 td 

alert("行号：" + (td.parentElement.rowIndex + 1) + "，内容：" + td.innerText); 
var tab = document.getElementById("test") ;
 //表格行数
 var rows = tab.rows.length ;
//表格列数
var cells = tab.rows.item(0).cells.length ;
alert("行数"+rows+"列数"+cells);
} 
</script> 
</head> 
<body> 
<table id="test" onclick="doclick()"> 
<tr> 
<td> 
9:00 
</td> 
<td> 
10:00 
</td> 
</tr> 
<tr> 
<td> 
11:00 
</td> 
<td> 
12:00 
</td> 
</tr> 
</table> 
</body> 
</html>

 

分享到：
| cookie设置和删除
评论
发表评论

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

相关推荐

    jQuery实现获取table中鼠标click点击位置行号与列号的方法

    为了获取行号和列号，我们需要找到该单元格在父`tr`（行）中的索引（列号）以及该`tr`在父`tbody`（表格体）或整个`table`中的索引（行号）： ```javascript var tdSeq = $(this).parent().find("td").index($(this...

    Jquery获得鼠标在Table上的行号列号，以及值

    在网页开发中，jQuery是一个非常流行的JavaScript库，它极大地简化了DOM操作、事件处理和动画效果。当涉及到表格（Table）交互，特别是需要获取用户在表格上点击时的行号、列号以及该位置的数据时，jQuery提供了一些...

    JS操作table大全

    在JavaScript的世界里，HTML表格（Table）是一...然而，实际开发中可能需要根据具体需求进行更复杂的定制和优化，这就需要开发者具备深厚的JavaScript和DOM操作基础。希望这个"JS操作table大全"能为你提供有用的参考。

    判断鼠标点击所在表格的第几行以及删除表格的行

    当涉及到表格（Table）元素时，我们可能需要获取用户点击的表格行（tr）的索引，以便执行特定的操作，如删除该行。这个场景在数据管理、表格编辑等应用中尤为常见。以下我们将详细讲解如何实现这个功能。 首先，...

    jQuery学习笔记(4)--Jquery中获取table中某列值的具体思路

    最后，作者展示了如何利用这些行号和列号在业务处理中获取表格中特定位置的值。在示例中，作者通过点击弹出框的“确定”按钮来触发获取ID值的操作。使用jQuery选择器`$('#users').find('tr:eq('+trNum+')').find('td...

    javascript 移动鼠标得到单元格所在table表中的rowIndex位置[兼容ie,firefox] <font color=red>原创</font>

    总结来说，本文通过具体的代码示例和详细解释，介绍了在IE和Firefox浏览器中使用JavaScript获取鼠标事件中单元格位置的方法。通过条件判断来兼容不同浏览器的事件属性差异，并着重强调了在Web开发中遵循标准的重要性...

    js处理表格对table进行修饰

    接着，在JavaScript中，获取表格（table）的DOM节点，然后遍历所有行（rows），通过模运算（%）判断行号，奇数行添加`.one`类，偶数行添加`.two`类。最后，将`trcolor`函数绑定到`window.onload`事件，确保在页面...

    基于javascript实现表格的简洁操作_.docx

    在JavaScript中，表格（Table）的操作是Web开发中常见的任务之一。这篇文章主要讲解如何使用JavaScript实现对HTML表格的简洁操作，包括添加行、删除行以及数据的筛选。这些功能对于构建交互式的网页应用非常有用。 ...

    Table隔行变色的JavaScript代码

    在循环中，根据行号的奇偶性设置不同的初始背景色，并为每行添加鼠标悬停和离开时改变颜色的事件监听器。 9. **事件处理函数**： 在`onmouseover`和`onmouseout`事件中，通过改变`style.backgroundColor`来实现...

    javascript 对表格的行和列都能加亮显示

    在探讨如何使用JavaScript实现表格的行和列同时加亮显示时，我们可以从给定的文件内容中提取以下知识点： 1. **表格行列加亮显示原理**： - 加亮显示通常是指通过JavaScript改变表格单元格（td或th）的CSS样式，以...

    用JS获得表格当前行数的代码

    ### 使用JavaScript获取表格当前行数的方法 在网页开发过程中，我们经常会遇到需要处理HTML表格的情况。比如统计表格中的行数、...以上就是使用JavaScript获取表格当前行数的相关方法和技术要点，希望对你有所帮助。

    javascript简单实现表格行间隔显示颜色并高亮显示

    JavaScript中的`document.getElementsByTagName("table")[0]`会获取页面中第一个表格元素，这保证了操作对象的准确性。因为可能在页面上有多个表格，`[0]`表明我们只选择第一个。 2. **遍历表格行**： 使用`for`...

    原生javascript实现隔行换色

    在网页设计中，为了提高数据表格的可读性，经常采用隔行换色的方法，使得用户更容易区分每一行的信息。本篇文章将详细讲解如何使用原生...希望这个简单的例子能帮助你更好地理解和应用JavaScript在网页开发中的作用。

    JS实现简洁(隔行换色、高亮显示)表格特效

    在这段关于JavaScript实现简洁表格特效的描述中，介绍了如何通过JavaScript代码创建一个具有隔行换色和鼠标滑过时高亮显示效果的表格。下面是根据给定文件信息中所提供的知识点的详细说明： 1. **隔行换色效果的...

    javascript实现Email邮件显示与删除功能

    JavaScript 实现 Email 邮件显示与删除功能主要涉及到网页交互和表格操作，具体知识点包括： 1. **HTML 表格操作**： - `table` 元素用于创建表格，`tr` 代表行，`td` 代表单元格，`th` 代表表头。 - `name` 属性...

    js实现表格隔行变色

    在网页设计中，为了提升数据展示的可读性和美观性，常常会采用隔行变色的技巧，使得表格中的每一行交替显示不同的颜色。这里提到的"js实现表格隔行变色"就是一种通过JavaScript来动态改变HTML表格行背景色的技术。在...

    jqurey表格應用

    在IT行业中，jQuery是一个非常流行的JavaScript库，它简化了HTML文档遍历、事件处理、动画设计和Ajax交互。"jQuery表格应用"这个主题是关于如何利用jQuery来增强和美化HTML表格的功能，使得网页的交互性更强，用户...

    简单的js表格操作

    文章中介绍的这些JavaScript表格操作，包括改变行背景色、动态添加和删除行等，都是前端开发中非常基础且常用的技术。通过这些知识点的学习，初学者可以更好地理解JavaScript在DOM操作中的应用，并能在此基础上进行...

    前端开发面试题

    - 通常使用鼠标事件获取鼠标位置，并据此调整元素的位置。 #### `transform2D` 与 `transform3D` 区别 - **`transform2D`**：基于2×3矩阵进行变换。 - **`transform3D`**：基于4×4矩阵进行变换。 - **性能差异**...

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