Đếm số hàng trong một bảng không sử dụng jquery

<head> 
<script language="javascript"> 
// must have the onload handler 
onload = function countRows(){ 
    var rows = document.getElementById('myTableId').getElementsByTagName('tbody')[0].rows.length; 
    alert(rows); 
// outputs 3 
} 

</script> 
</head> 

<body> 
    <table id="myTableId"> 
     <tbody> 
      <tr><td></td><td><input onclick="doA_Function_That_Includes_CountRows()" /> 
      </td></tr> 
      <tr><td></td><td></td></tr> 
      <tr><td></td><td></td></tr> 
     </tbody> 
    </table> 
</body> 
</html>

Nguồn

2011-12-03 phpmeh

Bạn có muốn đếm số lượng hàng trong bảng, hoặc tbody? – Thai

Trong tbody. bảng có một tiêu đề và các hàng khác bên ngoài tbody tôi không muốn đếm. – phpmeh

Hãy thử điều này:

var rows = document.getElementById('myTableId').getElementsByTagName('tbody')[0].getElementsByTagName('tr').length;

http://jsfiddle.net/y8URn/

Nó sẽ đếm số <tr> s trong <tbody>, mà lần lượt sẽ là số hàng trong bảng.

Lưu ý rằng nó sẽ KHÔNG tính tất cả các hàng trong bảng chỉ trong nội dung bảng . Nếu bạn có <thead> hoặc <tfoot> hoặc thậm chí là một hàng bên ngoài tbody, nó sẽ không được tính.

Nguồn

2011-12-03 17:24:40

Nó dường như không hoạt động trừ khi hàm được khởi tạo sau khi TBODY trong HTML. Tôi không thể thực hiện cuộc gọi đến hàm trong tiêu đề. Tôi phải đặt nó sau Tbody. – phpmeh

Rõ ràng. như với bất kỳ mã JavaScript nào, nếu một phần tử chưa được trình duyệt tải xuống, phần tử đó không tồn tại trên trang. Nói chung, các thẻ '

Hãy thử:

var numberOfRows = document.getElementById('myTableId').getElementsByTagName('tbody')[0].getElementsByTagName('tr').length;

Nguồn

2011-12-03 17:25:46 Ryan

Tôi đã thử. Nó cũng trở lại 1. Nó có vẻ là vấn đề mà chức năng được gọi. – phpmeh

@phpmeh: Ồ, nó không nằm trong bộ xử lý 'onload'? Được rồi ... đặt nó vào trình xử lý 'onload' :) – Ryan

Một cách khác, bằng cách sử dụng rows property ^[MDN]:

var num = document.getElementById('myTableId').rows.length;

Nếu bạn chỉ muốn đếm các hàng từ các yếu tố đầu tiên tbody, chọn điểm đó trước (tBody property ^[docs])

var num = document.getElementById('myTableId').tBodies[0].rows.length;

Nguồn

2011-12-03 17:28:58

+1 cho' tbodies'. Tôi không có ý tưởng nào tồn tại. – Ryan

Tôi đã làm cho nó hoạt động theo cách này. Nó đã cho tôi 1. Khi tôi gọi điện thoại đến chức năng sau tbody của tôi, nó hoạt động. Thật không may, tôi cần gọi hàm ở đầu Tbody. – phpmeh

@phpmeh: Bạn chỉ có thể tham khảo hoặc nhận thông tin về phần tử DOM sau khi được tạo. –

Dưới đây là triển khai hoạt động:

var table = document.getElementById("myTableId"); 
var tbody = table.tBodies[0]; 
alert(tbody.rows.length);

Và một jsFiddle mẫu: http://jsfiddle.net/9a6zK/

Nguồn

2011-12-03 17:29:12

Các vấn đề liên quan

Đếm số hàng trong một bảng không sử dụng jquery

Trả lời

Các vấn đề liên quan