Trong bài học này, chúng ta sẽ sử dụng lập trình để giải bài toán Json Data From Server Into Html Table. Điều này được thể hiện bằng đoạn mã dưới đây
[ { "Book ID": "1", "Book Name": "Computer Architecture", "Category": "Computers", "Price": "125.60" }, { "Book ID": "2", "Book Name": "Asp.Net 4 Blue Book", "Category": "Programming", "Price": "56.00" }, { "Book ID": "3", "Book Name": "Popular Science", "Category": "Science", "Price": "210.40" } ]
Người ta có thể giải quyết cùng một vấn đề bằng nhiều chiến lược khác nhau Dữ liệu Json từ Máy chủ vào Bảng Html. Không có cách nào đúng để làm điều đó. Trong các đoạn tiếp theo, chúng ta sẽ thảo luận về nhiều giải pháp thay thế khác nhau cho vấn đề hiện tại
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Như chúng ta đã thấy, một số lượng lớn các ví dụ đã được sử dụng để giải quyết vấn đề Dữ liệu Json từ Máy chủ vào Bảng Html đã xuất hiện
HtmlTableToJson trích xuất các tiêu đề bảng [
npm install tabletojson2 ] để sử dụng làm khóa đối tượng JSON. Hàng đầu tiên được sử dụng khi không có phần tử
npm install tabletojson2 nào
Giấy phép
MIT © Brandon Smith
- 3 từ khóa
- 1 phụ thuộc
- 21 người phụ thuộc
- 8 phiên bản
htmltablejson
cổ vũ
@restqa/restqadatarcdl-assetsroyalcanin-webdesignlanguage-assetsmyfrontdesk-testawpl-level-monitor@nieopierzony/corebrfinanceconfluence-i18n-importerconsulta-boavista-v2boavista-v2@restqa/restqdataebraft-extensionsfaq10get-data-pkghiobroker. solarlogmailnode-addu-sisyi-apipublic-transport@home_agency/rcdl--assets@jwrunge/datatable@koalarx/scrapping
Có thể chuyển mã đánh dấu cho một bảng dưới dạng chuỗi, một đoạn HTML hoặc toàn bộ trang hoặc chỉ một URL [với chức năng gọi lại tùy chọn; lời hứa cũng được hỗ trợ]
Phản hồi luôn là một mảng. Mỗi mục nhập mảng trong phản hồi đại diện cho một bảng được tìm thấy trên trang [theo cùng thứ tự chúng được tìm thấy trong HTML]
Kể từ phiên bản 2. 0 tabletojson được viết hoàn toàn bằng bản thảo
CHÚ Ý. Thay đổi API không tương thích trong phiên bản 2. 0. 0 kể từ khi yêu cầu. js không được dùng nữa. Thêm thông tin tại đây
Chuyển đổi từ phiên bản 1. + đến 2. x
- Yêu cầu phải được thay đổi từ
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];
5 thành// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];
6 hoặc// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];
7 - Thay thế tùy chọn yêu cầu bằng tùy chọn có. Thêm thông tin tại đây
sử dụng cơ bản
Cài đặt qua npm
npm install tabletojson
Điều khiển từ xa [// example-6.js
'use strict';
const {Tabletojson: tabletojson} = require['../dist'];
const fs = require['fs'];
const path = require['path'];
const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}];
const converted = tabletojson.convert[html];
console.log[converted];
8]
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];
Địa phương [// example-6.js
'use strict';
const {Tabletojson: tabletojson} = require['../dist'];
const fs = require['fs'];
const path = require['path'];
const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}];
const converted = tabletojson.convert[html];
console.log[converted];
9]
Có một cái nhìn trong các ví dụ
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];
Sao chép tiêu đề cột
Nếu có các tiêu đề cột trùng lặp, các tiêu đề tiếp theo sẽ được thêm vào một số đếm
PLACEVALUEPLACEVALUEabc1def2table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }0Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Bảng có hàng
Có các bảng có rowspan, nội dung của ô được sinh ra phải có sẵn trong đối tượng tương ứng
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }1Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Các bảng có hàng phức tạp
Có các bảng có các hàng phức tạp, nội dung của ô được sinh ra phải có sẵn trong đối tượng tương ứng
Cha mẹCon tuổiKết hônSue15Steve12Tom3TaylorPeter17table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }2Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Các bảng có tiêu đề trong cột đầu tiên
Nếu một bảng chứa các tiêu đề trong cột đầu tiên, bạn có thể nhận được kết quả không mong muốn, nhưng bạn có thể chuyển đối số thứ hai với các tùy chọn bằng
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }00 để nó xử lý cột đầu tiên giống như bất kỳ ô nào khácData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }4Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Bảng có HTML
Các tùy chọn sau đây là đúng theo mặc định, sẽ chuyển đổi tất cả các giá trị thành văn bản thuần túy để cung cấp cho bạn một đối tượng dễ đọc hơn để làm việc với
- dảiHtmlFromHeadings
- dảiHtmlFromCells
Nếu bảng của bạn chứa HTML mà bạn muốn phân tích cú pháp [ví dụ: đối với các liên kết], bạn có thể đặt
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }01 thànhData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }02 để coi bảng đó là văn bản thôData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }7Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Ghi chú. Điều này không hoạt động với các bảng lồng nhau mà nó vẫn sẽ cố phân tích cú pháp
Bạn có thể không cần đặt
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }03 thànhData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }02 [và đặt thành false có thể khiến kết quả khó phân tích cú pháp], nhưng nếu cần, bạn cũng có thể đặt cả hai cùng lúc bằng cách đặtData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }05 thànhData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }02Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Tùy chọn
CHÚ Ý. Vì yêu cầu không được hỗ trợ tích cực, chúng tôi cần chuyển sang thay thế yêu cầu đáng tin cậy và tôi đã quyết định sử dụng got
Đây là một thay đổi không tương thích trong phiên bản 2++, vì vậy hãy ghi nhớ điều này và làm theo Hướng dẫn di chuyển của Sindre
Đối với các tính năng đặc biệt như sử dụng proxy, bạn nên làm theo hướng dẫn này. proxy
có [chỉ // example-6.js
'use strict';
const {Tabletojson: tabletojson} = require['../dist'];
const fs = require['fs'];
const path = require['path'];
const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}];
const converted = tabletojson.convert[html];
console.log[converted];
8]
Chúng tôi đang sử dụng got để tìm nạp các trang HTML từ xa. Vì vậy, nếu bạn cần lấy dữ liệu từ một máy chủ từ xa, bạn có thể gọi
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }08 và chuyển bất kỳ tùy chọn nhận nào [proxy, tiêu đề,. ] bằng cách thêm một đối tượng got vào các tùy chọn được chuyển đếnData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];8. để biết thêm thông tin về cách định cấu hình yêu cầu, vui lòng xem Proxy
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];5
dảiHtmlFromHeadings
Tách bất kỳ HTML nào khỏi các ô tiêu đề. Mặc định là đúng
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];6
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];0
dảiHtmlFromCells
Tách bất kỳ HTML nào khỏi các ô của bảngBody. Mặc định là đúng
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];1
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];2
buộc IndexAsSố
Thay vì sử dụng văn bản cột [đôi khi sắp xếp lại dữ liệu], hãy buộc chỉ mục dưới dạng số [số chuỗi]
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];3
đếm trùng lặp tiêu đề
Mặc định là
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }10. Nếu được đặt thànhData extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }02, các tiêu đề trùng lặp sẽ không nhận được số ở cuối. Giá trị của trường sẽ là giá trị cuối cùng được tìm thấy trong hàng của bảngPLACEVALUEPLACEVALUEabc1def2ghi3jkl4Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];4
bỏ qua các cột
Mảng các chỉ mục được bỏ qua, bắt đầu bằng 0. Mặc định là 'null/không xác định'
TÊNNƠI TRỌNG TRỌNG LƯỢNGSEXAGEMel158W23Tom278M54Bill392M31'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];5
chỉCột
Mảng các chỉ mục được lấy, bắt đầu bằng 0. Mặc định là 'null/không xác định'. Nếu được cung cấp, tùy chọn này sẽ ghi đè các cột bỏ qua
TÊNNƠI TRỌNG TRỌNG LƯỢNGSEXAGEMel158W23Tom278M54Bill392M31'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];6
bỏ quaHiddenRows
Cho biết nếu các hàng ẩn [hiển thị. không có] được bỏ qua. Mặc định là đúng
TÊNNƠI TRỌNG TRỌNG LƯỢNGSEXAGEMel158W23Tom278M54Bill392M31- Con mèo. 4. 4. W. 2*
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];7
tiêu đề
Mảng các chuỗi được sử dụng làm tiêu đề. Mặc định là
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }12/Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }13Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Nếu có nhiều tiêu đề hơn số cột tồn tại thì những tiêu đề vượt quá sẽ bị bỏ qua. Nếu ít tiêu đề được đưa ra hơn các giá trị hiện có, các giá trị đếm vượt sẽ bị bỏ qua
TÊNNƠI TRỌNG TRỌNG LƯỢNGSEXAGEMel158W23Tom278M54Bill392M31- Con mèo. 4. 4. W. 2*
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];8
đường giới hạn
Số hàng mà đối tượng kết quả sẽ được giới hạn ở. Mặc định là
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }12/Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }13Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Bảng khổng lồ [xem bài kiểm tra/bảng. html]
Số người chơi nhập vaiTênVăn bản muốn nói0Raife Parkinsonre dolor in hendrerit in vulputate ve1Hazel Schultzusto duo dolores et ea rebum. Ste2Montana Delgadopsum dolor sit amet. Lorem ipsum dolor3Dianne Mcbridesit ame olor sit amet. Lorem ipsum4Xena Lynchus est Lorem ipsum dol5Najma Holdingakimata sanctus est Lorem ipsum dolor sit6Kiki Houseame nvidunt ut. 197Montana Delgadolores et ea rebum. Stet clita kasd gu a198Myrtle Conleyrebum. Stet clita kasd gubergren, no sea199Hanna Elliskimata sanctus est Lorem ipsum dolor siĐầu ra ví dụ với các giới hạn. 5
'use strict'; const tabletojson = require['tabletojson'].Tabletojson; tabletojson.convertUrl[ '//en.wikipedia.org/wiki/List_of_ISO_639-1_codes', function[tablesAsJson] { console.log[tablesAsJson[1]]; } ];9
chứa các lớp
Mảng các lớp để tìm một bảng cụ thể bằng lớp này. Mặc định là
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }12/Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
table { width: 100%; font: 17px Calibri; } table, th, td { border: solid 1px #DDD; border-collapse: collapse; padding: 2px 3px; text-align: center; }13Data extracted from a JSON and converted to an HTML table.
$[document].ready[function [] { $.getJSON["../../library/sample.json", function [data] { var arrItems = []; // THE ARRAY TO STORE JSON ITEMS. $.each[data, function [index, value] { arrItems.push[value]; // PUSH THE VALUES INSIDE THE ARRAY. }]; // EXTRACT VALUE FOR TABLE HEADER. var col = []; for [var i = 0; i < arrItems.length; i++] { for [var key in arrItems[i]] { if [col.indexOf[key] === -1] { col.push[key]; } } } // CREATE DYNAMIC TABLE. var table = document.createElement["table"]; // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. var tr = table.insertRow[-1]; // TABLE ROW. for [var i = 0; i < col.length; i++] { var th = document.createElement["th"]; // TABLE HEADER. th.innerHTML = col[i]; tr.appendChild[th]; } // ADD JSON DATA TO THE TABLE AS ROWS. for [var i = 0; i < arrItems.length; i++] { tr = table.insertRow[-1]; for [var j = 0; j < col.length; j++] { var tabCell = tr.insertCell[-1]; tabCell.innerHTML = arrItems[i][col[j]]; } } // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. var divContainer = document.getElementById["showData"]; divContainer.innerHTML = ""; divContainer.appendChild[table]; }]; }];
Các vấn đề và hạn chế đã biết
Mô-đun này chỉ hỗ trợ phân tích cú pháp các bảng cơ bản với một bộ theo chiều ngang đơn giản gồm 118 tiêu đề và 119 ô tương ứng
Nó có thể đưa ra kết quả vô dụng hoặc kỳ lạ trên các bảng có cấu trúc phức tạp [chẳng hạn như bảng lồng nhau] hoặc nhiều tiêu đề [chẳng hạn như trên cả trục X và Y]
Bạn sẽ cần xử lý những việc như tìm ra bảng nào cần phân tích cú pháp và [trong hầu hết các trường hợp] dọn sạch dữ liệu. Bạn có thể muốn kết hợp nó với các mô-đun như json2csv hoặc CsvToMarkdownTable
Bạn có thể muốn sử dụng nó với một mô-đun như 'cheerio' nếu bạn muốn phân tích các bảng cụ thể được xác định bởi id hoặc lớp [i. e. chọn chúng bằng cheerio và chuyển HTML của chúng dưới dạng chuỗi]
Ví dụ sử dụng
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];0
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];1
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];2
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];3
Vấn đề
Ngay bây giờ, bảng cần được "định dạng tốt" để có thể chuyển đổi. Bảng trong bảng không được xử lý
// example-6.js 'use strict'; const {Tabletojson: tabletojson} = require['../dist']; const fs = require['fs']; const path = require['path']; const html = fs.readFileSync[path.resolve[__dirname, '../test/tables.html'], {encoding: 'UTF-8'}]; const converted = tabletojson.convert[html]; console.log[converted];4
Đóng góp
Các cải tiến, bản sửa lỗi và đề xuất cho các mô-đun được viết tốt hơn mà người khác đã tạo đều được chào đón, cũng như các báo cáo lỗi đối với các bảng cụ thể mà nó không thể xử lý
Bạn có thể tìm thấy các bài kiểm tra cơ bản trong thư mục kiểm tra. Tôi đã triển khai cách đơn giản nhất trong việc sử dụng thư viện. Tuy nhiên, có một số trường hợp Edge cần được kiểm tra và tôi muốn yêu cầu hỗ trợ tại đây. Thoải mái rẽ nhánh và tạo PR tại đây. Mọi sự giúp đỡ đều được đánh giá cao
Để hiểu rõ hơn, bạn có thể sử dụng các ví dụ của Iain nằm trong thư mục ví dụ đi kèm với dự án này cho thấy cách sử dụng và sẽ là một khởi đầu tốt
Nếu bạn gửi yêu cầu kéo, vui lòng thêm một ví dụ cho trường hợp sử dụng của bạn, để tôi có thể hiểu bạn muốn nó làm gì [vì tôi muốn viết bài kiểm tra cho điều này và muốn hiểu loại trường hợp sử dụng mà mọi người có]
Cảm ơn
Tháng 6 năm 2018 - Xin gửi lời cảm ơn đặc biệt tới người khởi xướng thư viện, Iain Collins [@iaincollins]. Nếu không có sự điều tra của anh ấy trong việc nắm bắt và làm chủ trang web, lib này sẽ không có được như bây giờ. Ngoài ra, cá nhân tôi muốn nói "Cảm ơn" vì sự tin tưởng của bạn trong việc chuyển giao quyền sở hữu cho tôi. Marius [@maugenst]