Question

我有这个HTML：

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <div class='panel-heading'>
        TV Schedules
    </div>
    <div class='panel-body'>
        <table class='table table-striped table-inverse font_styling table-hover' id='tv_schedule_table'>
            <thead>
                <tr>
                    <th class='center_text sorttable' width='25%'>Show Name&nbsp; <span class='fa fa-caret-down'></span> <span class='fa fa-caret-up'></span></th>
                    <th class='center_text sorttable' width='25%'>Episode&nbsp; <span class='fa fa-caret-down'></span> <span class='fa fa-caret-up'></span></th>
                    <th class='center_text sorttable'>Date Aired&nbsp; <span class='fa fa-caret-down'></span> <span class='fa fa-caret-up'></span></th>
                    <th width='10%'></th>
                </tr>
            </thead>
            <tbody>
                <tr id='tv_schedule_row'>
                    <td class='center_text cell_width' width='25%'>{{tv_show.show_name}}</td>
                    <td class='center_text clickable_cell' width='25%'>{{tv_show.season_episode}}</td>
                    <td class='center_text clickable_cell' width='20%'>{{tv_show.date_aired}}</td>
                    <td class='center_text w3-large' width='15%'><i class='fa fa-check icon-styling' style='margin-left:5px; margin-right:5px;'></i> <i class='fa fa-trash icon-styling' style='margin-left:5px; margin-right:5px;'></i> <i class='fa fa-search icon-styling' style='margin-left:5px; margin-right:5px;'></i> <i class='fa fa-plus icon-styling' style='margin-left:5px; margin-right:5px;'></i></td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>

这是调用hightlight行的函数：

$scope.alter_show = function(show, index)
{
    $scope.editing_show = true;

    var line_no = index+1;
    var table   = document.getElementById("tv_schedule_table");
    var cells   = table.getElementsByTagName("tr"); 

    cells[line_no].className = "hover_click_cell selected_click_cell";
}

由于某些原因，这对第一行不起作用，但从第2行开始，它起作用。我不太确定我在哪里错了。

Answer 1

一开始索引的价值是多少？

记住“cells”对象将被索引为0，因此第一个“tr”元素将是tr [0]

Answer 2

检查更新的代码

$scope.alter_show = function(show, index)
{
    $scope.editing_show = true;
    var line_no = index;
    var table   = document.getElementById("tv_schedule_table");
    var cells   = table.tBodies[0].getElementsByTagName("tr"); 
    cells[line_no].className = "hover_click_cell selected_click_cell";
}

单击时表行突出显示 - 不突出显示第一行

2 个答案: