Question

我使用JavaScript函数insertRow（）和insertCell（）函数在HTML中创建了一个表。我为每个单元格分配了一个id。我想用JavaScript获取单元格的值/内容。

以下是用于创建表格的代码：

<HTML>
<HEAD>
    <SCRIPT language="javascript">
        function addRow(tableID) {
            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;

            var row = table.insertRow(rowCount);
            row.id = rowCount;

            var cell1 = row.insertCell(0);
            cell1.id = rowCount + 'a';
            cell1.innerHTML = "CELL1";

            var cell2 = row.insertCell(1);
            cell2.id = rowCount + 'b';
            cell2.innerHTML = "CELL2";

            var cell3 = row.insertCell(2);
            cell3.id = rowCount + 'c';
            cell3.innerHTML = "CELL3";

            var cell4 = row.insertCell(3);
            cell4.id = rowCount + 'd';
            cell4.innerHTML = "CELL4";
        }
     </SCRIPT>
</HEAD>
<BODY>

    <INPUT type="button" value="Add Row" onclick="addRow('dataTable')" />

    <TABLE id="dataTable" width="350px" border="1">
    <thead>
    <TD>Column 1</TD>
    <TD>Column 2</TD>
    <TD>Column 3</TD>
    <TD>Column 4</TD>
    </thead>
    </TABLE>

</BODY>

我已经尝试过以下选项：

警报（的document.getElementById（1A））; 空
警报（的document.getElementById（1a）中。价值）; 错误消息：Microsoft JScript运行时错误：无法获取属性“value”的值：object为null或undefined
警报（的document.getElementById（ “dataTable的”）的行[rowCount时] .cells [0]）; [对象
警报（的document.getElementById（ “dataTable的”）的行[rowCount时] .cells [0]的ToString（））; [对象
警报（的document.getElementById（ “dataTable的”）的行[rowCount时] .cells [0]。价值。）; 未定义

Answer 1

以下是您获取单元格值的示例。

鉴于您按顺序命名它们（从行开始，然后是a，b，c，d，您应该可以通过ID 1a或3c来访问它们。话虽如此，以下{{ 3}}（补充你发布的内容）：

<!-- head -->
<script>
    function getVal(cellId){
        var cell = document.getElementById(cellId);
        document.getElementById('a').innerHTML = cell.innerHTML;

        // highlight the cell for visual effect
        cell.className = 'target';
        setTimeout(function(){ cell.className = ''; }, 1e3);
    }
</script>
<!-- /head -->

<!-- body -->
<INPUT type="text" id="q" />
<INPUT type="button" value="Get Value" onclick="getVal(document.getElementById('q').value);" />
<span id="a"></span>
<!-- /body -->

Answer 2

首先，您应该知道行号。

使用document.getElementById（id）获取内容。例如，id = $ rownumber + [abcd]

Answer 3

表格单元格没有value属性，但您可以通过innerHTML属性或innerText属性访问内容。不同之处在于后者对浏览器的支持有所限制，它提供了文本内容，没有任何标签。例如：

alert(document.getElementById('1a').innerHTML)

如果这不起作用（如评论似乎所说），则问题出在其他地方。然后你应该发布实际上重现问题的代码。

Answer 4

要使用当前代码访问单元格的内容，您只需按照您提供的ID来处理每个单元格，然后访问innerHTML属性：

    var myCell = document.getElementById('1c')

    var myCellContent = myCell.innerHTML

请记住，每列都有标题，因此实际拥有内容的第一行将是＆＃39; 1＆＃39;而不是＆＃39; 0＆＃39;。

Answer 5

我可以使用以下代码访问单元格内容：

<强>的document.getElementById（ “dataTable中”）。行[rowCount时] .cells [0] .innerHTML

如何使用单元格ID访问HTML表格中单元格的内容？

5 个答案: