Hướng dẫn get data in table javascript - lấy dữ liệu trong bảng javascript

31

Mới! Lưu câu hỏi hoặc câu trả lời và sắp xếp nội dung yêu thích của bạn. Tìm hiểu thêm.
Learn more.

Làm cách nào để kéo dữ liệu (chuỗi) từ một cột gọi là "giới hạn" trong bảng ("DisplayTable") trong JavaScript?

var table = document.getElementById('displayTable');    
var rowCount = table.rows.length;    
for (var i = 1; i < rowCount - 1; i++) {    
     var row = table.rows[i]["Limit"].ToString();
     alert(row);
     ...
}

Hướng dẫn get data in table javascript - lấy dữ liệu trong bảng javascript

Trilarion

10.2k9 Huy hiệu vàng63 Huy hiệu bạc101 Huy hiệu Đồng9 gold badges63 silver badges101 bronze badges

hỏi ngày 14 tháng 7 năm 2010 lúc 17:38Jul 14, 2010 at 17:38

Đây là cách tôi hoàn thành việc đọc một bảng trong JavaScript. Về cơ bản, tôi đã khoan xuống các hàng và sau đó tôi có thể đi sâu vào các ô riêng lẻ cho mỗi hàng. Điều này sẽ cho bạn một ý tưởng

//gets table
var oTable = document.getElementById('myTable');

//gets rows of table
var rowLength = oTable.rows.length;

//loops through rows    
for (i = 0; i < rowLength; i++){

   //gets cells of current row
   var oCells = oTable.rows.item(i).cells;

   //gets amount of cells of current row
   var cellLength = oCells.length;

   //loops through each cell in current row
   for(var j = 0; j < cellLength; j++){
      /* get your cell info here */
      /* var cellVal = oCells.item(j).innerHTML; */
   }
}

Cập nhật - tập lệnh được kiểm tra

A1 A2 A3
B1 B2 B3

Hướng dẫn get data in table javascript - lấy dữ liệu trong bảng javascript

Đã trả lời ngày 14 tháng 7 năm 2010 lúc 17:51Jul 14, 2010 at 17:51

Hướng dẫn get data in table javascript - lấy dữ liệu trong bảng javascript

webdad3webdad3webdad3

8.78829 Huy hiệu vàng120 Huy hiệu bạc218 Huy hiệu đồng29 gold badges120 silver badges218 bronze badges

6

Trong mã này data là một mảng dữ liệu bảng hai chiều

let oTable = document.getElementById('datatable-id');
let data = [...oTable.rows].map(t => [...t.children].map(u => u.innerText))

Đã trả lời ngày 16 tháng 7 năm 2019 lúc 8:38Jul 16, 2019 at 8:38

Sử dụng JSON & JQuery. Nó dễ dàng hơn so với JavaScript cũ

function savedata1() { 

var obj = $('#myTable tbody tr').map(function() {
var $row = $(this);
var t1 = $row.find(':nth-child(1)').text();
var t2 = $row.find(':nth-child(2)').text();
var t3 = $row.find(':nth-child(3)').text();
return {
    td_1: $row.find(':nth-child(1)').text(),
    td_2: $row.find(':nth-child(2)').text(),
    td_3: $row.find(':nth-child(3)').text()
   };
}).get();

Hướng dẫn get data in table javascript - lấy dữ liệu trong bảng javascript

webdad3

8.78829 Huy hiệu vàng120 Huy hiệu bạc218 Huy hiệu đồng29 gold badges120 silver badges218 bronze badges

Trong mã này data là một mảng dữ liệu bảng hai chiềuMay 7, 2013 at 9:09

Đã trả lời ngày 16 tháng 7 năm 2019 lúc 8:38Anjana

Sử dụng JSON & JQuery. Nó dễ dàng hơn so với JavaScript cũ1 silver badge4 bronze badges

Nếu bạn vẫn đang sử dụng HTML để hiển thị dữ liệu trên trang web của mình, bài đăng này và ví dụ của nó sẽ hữu ích. Trước đây tôi đã đăng một bài viết giải thích cách chuyển đổi dữ liệu JSON một cách linh hoạt sang bảng HTML bằng JavaScript. Bây giờ, ở đây tôi đang chia sẻ một tập lệnh đơn giản cho thấy cách đọc dữ liệu từ bảng HTML bằng JavaScript.

Đầu tiên, tôi sẽ tạo một bảng nhỏ với tiêu đề và một vài hàng trong đó. Dữ liệu được mã hóa cứng.

Đánh dấu




    Read Data from HTML Table uisng JavaScript
    


    
ID Employee Name Age
01 Alpha 37
02 Bravo 29

onclick="showTableData()" />

Thử nó

Nó sẽ gọi chức năng khi ai đó nhấn nút. Tôi đang tạo một đối tượng của bảng bằng phương thức document.getEuityById (). Khi đối tượng được tạo, tôi sẽ có quyền truy cập vào tất cả các thuộc tính của bảng.

Tiếp theo, tôi đang chạy một vòng lặp để đọc từng hàng của bảng. Tuy nhiên, tôi đang bỏ qua hàng đầu tiên, vì nó có tiêu đề bảng. Do đó, trong vòng lặp For, tôi đã gán giá trị 1 cho biến i.for loop to read each row of the table. However, I am ignoring the first row, since it has the table header. Therefore, in the for loop, I have assigned value 1 to the variable i.

Cách chuyển đổi toàn bộ bảng HTML thành tài liệu PDF bằng JavaScript mà không cần trình cắm

Sau đó bên trong vòng lặp đầu tiên, tôi sẽ nhận được bộ sưu tập các ô của mỗi hàng. Bộ sưu tập (đối tượng) cung cấp các thuộc tính và giá trị của mỗi ô trong một hàng. Để trích xuất các giá trị từ mỗi ô, tôi đang chạy một vòng khác.cells collection of each row. The collection (object) provides the properties and values of each cell in a row. To extract values from each cell, I am running another for loop.

Đọc một dữ liệu cột cụ thể

Nếu bạn muốn trích xuất dữ liệu từ một cột cụ thể, thì bạn chỉ có thể gán giá trị cho biến J trong vòng lặp thứ hai. Mỗi cột hoặc có giá trị chỉ mục duy nhất bắt đầu từ 0.particular column, then you can simply assign value to the variable j in the second loop. Each column or

has a unique index value starting from 0.

Ví dụ: nếu bạn muốn hiển thị các giá trị của tuổi cột, thì bạn có thể gán giá trị 2 cho biến j. Như thế này,Age, then you can assign value 2 to the variable j. Like this,

for (var j = 2; j < objCells.length; j++) {
    info.innerHTML = info.innerHTML + ' ' + objCells.item(j).innerHTML;
}

Đầu ra bạn nhận được là 37 và 29 (từ ví dụ trên).

Đọc dữ liệu cột bằng thuộc tính "Cellindex"

Có một cách khác, bạn có thể nhận được giá trị ô cho một cột cụ thể mà không cần mã hóa cứng một số. Bạn có thể gán ID duy nhất cho mỗi tiêu đề () trong đánh dấu và nhận các giá trị chỉ mục bằng phương thức document.getEuityById ().without hard coding a number. You can assign unique id’s to each header (

) in the markup and get the index values using the document.getElementById() method.

Đánh dấu



    Read Data from HTML Table uisng JavaScript
    



    
ID Employee Name Age
01Alpha37
02Bravo29
03Charlie32

onclick="showTableData()" />

Thử nó

Vâng, đó là nó. Hy vọng bạn tìm thấy các ví dụ và đăng hữu ích. Bạn có thể chỉ đơn giản là quá trình sử dụng jQuery. Tuy nhiên, trong bài viết này, tôi đã cố gắng tập trung vào JavaScript. Nó cũng đơn giản.

Cảm ơn vì đã đọc. ☺

← Trước đó →Next →


Làm cách nào để lấy dữ liệu từ một bảng trong HTML?

Bộ sưu tập ô bảng..
Tìm hiểu có bao nhiêu ô trong hàng đầu tiên trong một bảng: getEuityByid ("mytable"). ....
[INDEX] Thông báo cho bên trong của ô đầu tiên trong hàng đầu tiên của bảng: ....
Mục (INDEX) Thông báo cho bên trong của ô đầu tiên trong hàng đầu tiên của bảng: ....
Được đặt tên (ID) ....
Thay đổi nội dung của ô bảng đầu tiên:.

Làm thế nào để bạn đọc dữ liệu từ một bảng?

Một bảng có thể được đọc từ trái sang phải hoặc từ trên xuống dưới.Nếu bạn đọc một bảng trên hàng, bạn đọc thông tin từ trái sang phải.Trong bảng mèo và chó, số lượng động vật đen là 2 + 2 = 4. Bạn sẽ thấy đó là những con số trong hàng trực tiếp ở bên phải của từ 'màu đen.. If you read a table across the row, you read the information from left to right. In the Cats and Dogs Table, the number of black animals is 2 + 2 = 4. You'll see that those are the numbers in the row directly to the right of the word 'Black.

JavaScript Rowindex là gì?

Thuộc tính RowIndex trả về vị trí của một hàng trong bộ sưu tập hàng của bảng.returns the position of a row in the rows collection of a table.

Làm cách nào để tổng hợp một cột trong JavaScript?

Làm cách nào để tổng hợp một cột trong JavaScript ?..
Mã nguồn dự án:.
.
var bảng = document.getEuityById (Bảng bảng), sumVal = 0 ;.
for (var i = 1; i ..
sumVal = sumVal + parseInt (bảng.Rows [i] .cells [2] .innerhtml) ;.
tài liệu.GetEuityByid (Val Val).InsideHTML = Giá trị tổng của Sum = Khăn + SumVal ;.