0

我有一个 HTML 表格。在此表中,我在最后一列中有链接(id="delete_row")。我正在尝试提取每个链接,但它不起作用。我看过一些关于它的帖子,并了解到这可能是拼写问题,但我检查了所有内容两次,仍然无法正常运行。这是我的代码:

var tbl = document.getElementById('my_table'); 
for (var i = 0 ;i<tbl.rows.length-1; i++) { // for each row
        row = tbl.rows[i];
        row.getElementById('delete_row').className="other_classname";
}

但是,此代码返回错误:

未捕获的类型错误:对象 #<HTMLTableRowElement> 没有方法“getElementById”

任何想法可能有什么问题?

4

4 回答 4

0

根据您的评论,要访问每行中的最后一个单元格,请替换:

row.getElementById('delete_row').className="other_classname";

和:

var len = document.getElementById("my_table").rows[i].cells.length;
document.getElementById("my_table").rows[i].cells[len - 1].className="other_classname";
于 2013-01-15T11:34:07.620 回答
0

我认为整个 HTML 的 ID 必须是唯一的。您多次使用 ID,这可能是问题所在。因此,如果您使用该class代替ID和功能getElementsByClassName代替getElementByID,它可能会解决您的情况。

于 2013-01-15T11:29:01.077 回答
0

The getElementById method is unique to the document root. No other element has this method. Therefore, you see the error:

Uncaught TypeError: Object # has no method 'getElementById'

The simplest way to solve this would be to use querySelector.

row.querySelector('#delete_row').className="other_classname"

That said, querySelector on nodes with lots of children can have performance implication. If that is the case you could assign a unique id to the element and actually use document.getElementById which has constant lookup speed. For smaller node trees it is perfectly fine to use it though.

于 2020-08-24T12:23:44.163 回答
0

您需要为您的 id 使用类结构。假设您将使用按钮添加行并使用 X 链接删除它们,就像您的一样。

<input type="button" value="add" id="btnAddRow">

<table id="customFields" align="center" cellspacing="0" cellpadding="0" border="0">
    <tr class="HeaderRow"><td colspan="7"></td></tr>
</table>

这是处理添加和删除过程的 javascript 代码:

$("#btnAddRow").click(function () {
        counter += 1;
        $("#customFields").show();
        $("#customFields").append('<tr valign="top"><td> ' + counter + '</td>' + '<td>' + '<a href="javascript:void(0);" class="removeRow">Delete</a></td></tr>');
    });

    $("#customFields").on('click', '.removeRow', function () {
        var rowId = $(this).parent().parent().index() - 1;
        $(this).parent().parent().remove();

        if ($('#customFields tr').length == 2) {
            $("#customFields").hide();
        }
    });

如您所见,动态过程将对您更有用。

于 2016-11-09T06:14:20.537 回答