Question

我在从html表返回行时遇到问题。有人可以指导我怎么做吗？我也在表格中使用了tbody标签。我不知道我做错了什么......

    <!DOCTYPE html>
<html>
    <body>
    <button type="button" onclick="DeleteRow()"> delete </button>
<table id="myTable" >
                    <thead>
                        <tr class="header">
                            <th>1</th>
                            <th>2</th>            
                        </tr>              
                    </thead>
                    <tbody>
                        <tr>
                            <td> <input type="checkbox" name="check" value="check" class="checkbox"> </td>
                            <td> 1 </td>            
                        </tr>
                        <tr>
                            <td> <input type="checkbox" name="check" value="check" class="checkbox"> </td>
                            <td> 2 </td>                          
                        </tr>
                    </tbody>
                </table>
<script>
function DeleteRow() {
            var table = document.getElementById("myTable") ; //table itself
            var tableBody = table.getElementsByTagName("tbody") ; //body of table
            var rows = tableBody.getElementsByTagName("tr") ; //rows in table-body
            document.write(rows.length) ; //wont work 
        }
</script>
    </body>
</html>

Answer 1

您正在引用HTML集合中的getElementsByTagName

var tableBody = table.getElementsByTagName("tbody") <-- HTML COllection
var rows = tableBody.getElementsByTagName("tr") ; <--html collection does not have getEl....

您需要引用索引才能使用方法

var rows = tableBody[0].getElementsByTagName("tr")

Answer 2

如果您尝试将信息放入他显示的内容中，您可以使用$（＃＃;＃message＆＃39;）。html（rows.length）;消息将是您想要

中信息的div的I＆＃39; d

Answer 3

.getElementsByTagName()返回一个HTMLCollection（就像一个数组:)

function DeleteRow() {
            var table = document.getElementById("myTable") ; //table itself
            var tableBody = table.getElementsByTagName("tbody") ; //body of table
            var rows = tableBody[0].getElementsByTagName("tr") ; //rows in table-body
            document.write(rows.length) ; //wont work 
        }

    <!DOCTYPE html>
<html>
    <body>
    <button type="button" onclick="DeleteRow()"> delete </button>
<table id="myTable" >
                    <thead>
                        <tr class="header">
                            <th>1</th>
                            <th>2</th>            
                        </tr>              
                    </thead>
                    <tbody>
                        <tr>
                            <td> <input type="checkbox" name="check" value="check" class="checkbox"> </td>
                            <td> 1 </td>            
                        </tr>
                        <tr>
                            <td> <input type="checkbox" name="check" value="check" class="checkbox"> </td>
                            <td> 2 </td>                          
                        </tr>
                    </tbody>
                </table>
<script>

</script>
    </body>
</html>

返回html表中的行

3 个答案: