CSDNRGY 2015-08-18 00:57 采纳率: 88.9%
浏览 2845
已采纳

如何用JavaScript操作table中tr中td的值?

如何用JavaScript操作table中tr中td的值?
如何用JavaScript操作table中tr中td的值?
如何用JavaScript操作table中tr中td的值?

  • 写回答

5条回答 默认 最新

  • tsinggao 2015-08-18 01:57
    关注
     <html>
    <head>
        <title>
            修改td中的值
        </title>
    </head>
    <body>
        <table id="myTable" width="400px" border="1px solid #CCC">
            <tr>
                <td height="50px" width="25%">
                1,1</td>
                <td height="50px" width="25%">
                1,2</td>
                <td height="50px" width="25%">
                1,3</td>
                <td height="50px" width="25%">
                1,4</td>
            </tr>
            <tr>
                <td height="50px" width="25%">
                2,1</td>
                <td height="50px" width="25%">
                2,2</td>
                <td height="50px" width="25%">
                2,3</td>
                <td height="50px" width="25%">
                2,4</td>
            </tr>
            <tr>
                <td height="50px" width="25%">
                3,1</td>
                <td height="50px" width="25%">
                3,2</td>
                <td height="50px" width="25%">
                3,3</td>
                <td height="50px" width="25%">
                3,4</td>
            </tr>
        </table>

        <br>

        <hr>
        <br>
        <input type="text" size="20" id="inputText">
        <input type="button" value="修改（3,3）td中的值" onclick="updateValue('inputText',2,2);"
    </body>
    <script>
        function updateValue(textId,row,col){
            table = document.getElementById('myTable');
            table.rows[row].cells[col].firstChild.nodeValue = document.getElementById(textId).value;
        }
    </script>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(4条)

报告相同问题？

  • Table相关整理及Javascript操作table,tr,td
    2020-12-13 19:58
    很多人都有这种经历：当某个td中没有内容或者没有可见元素时，td的border也会消失。解决方案就是给table添加样式border-collapse:collapse 一般的文字截断(适用于内联与块)： 复制代码代码如下: .text-overflow{ ...
  • JS动态添加Table的TR，TD实现方法
    2020-10-24 19:22
    除了上述内容，标签中还提到“JS 动态 添加 Table TR TD 方法”，这表明文章着重讨论了使用原生JavaScript（不依赖于任何框架或库）来实现这一功能。在现代Web开发中，虽然诸如jQuery这样的库提供了更简便的方法来...
  • JavaScript获取tr td 的三种方式全面总结（推荐）
    2020-10-19 09:23
    在JavaScript中，获取HTML表格（table）中的tr和td元素是常见的操作，特别是在处理动态数据或者交互式表格时。以下是对三种获取方法的详细讲解： 1. **原生JavaScript**： - 首先，通过`document.getElementById`...
  • JS动态创建Table,Tr,Td并赋值的具体实现
    2020-10-27 03:16
    文档展示了通过JavaScript函数getzts()和callback5()来动态生成表格（Table），以及表格的行（Tr）和单元格（Td）。利用DOM操作方法如insertRow()和insertCell()，可以根据条件创建新的行和列，为表格添加新的数据项...
  • 用jQuery获取table中行id和td值的实现代码
    2020-10-22 08:08
    // 用jQuery获取table中td值 $("#mytable td").click(function(){ alert("table td值：" + $(this).text()); });// 用jQuery获取table中点击位置所在行的id $("#mytable td").click(function(){ // 获取td的id...
  • jq 隐藏table中的tr或td
    2014-02-23 18:34
    本篇文章将详细讲解如何在不预先知道table ID的情况下，使用jQuery来隐藏table中的tr或td元素，以及涉及到的相关知识点。 首先，让我们了解HTML的table结构。一个基本的HTML表格由`<table>`标签开始，内部包含`<tr>...
  • Javascript遍历table中的元素示例代码
    2020-12-11 23:20
    　<tr><td> </td><td> </td><td> </td><td> </td></tr> 　<tr><td> </td><td> </td><td> </td><td> </td></tr> </table> 而在JS中如何遍历赋值呢？ 程序代码 var count=0; for(i=0; i < document....
  • html tr加样式,Javascript操作table,tr,td和表格CSS样式设置小常识
    2021-06-14 07:52
    老白Walt的博客 效果图：方法一姓名性别住址电话张三男...关于html中table表格tr,td的高度和宽度做网页的时候经常会遇到各种各样的问题，经常遇到的一个就是会碰到表格宽度对不齐的问题。.mytab{ border-collapse: co...
  • js 获取 table所有tr标签下第一个td的值
    2023-06-28 17:06
    FOAF-lambda的博客 table class="gridtable"> <thead> <tr> <th style="width: 20px;"> <input type="checkbox" name="allCheck" onclick="checkAll('allCheck', 'itemCheck')"> </th> <th ...
  • 用Jquery获取table中td的值
    2019-03-31 01:48
    在"用Jquery获取table中td的值"这个场景下，可能需要遍历整个表格获取所有`td`的值。可以使用`.each()`方法来实现： ```javascript $("table tr td").each(function(index, element) { var value = $(element)....
  • 没有解决我的问题, 去提问