35 Alat, Skrip dan Plugin untuk Membina Jadual HTML Cantik

Visualisasi data adalah kunci untuk lebih memahami maklumat yang rumit atau rumit. Terdapat banyak cara untuk menggambarkan data anda jadi anda boleh merekabentuk maklumat grafik yang sejuk atau membuat carta interaktif ‐ ia semua bergantung pada data anda dan bagaimana anda ingin membentangkannya.

Walau bagaimanapun, jawatan hari ini adalah semata-mata mengenai subjek jadual dan sesetengahnya benar-benar sumber yang berguna untuk membuat pelbagai jenis jadual. Berikut adalah 35 petua, alat, skrip dan plugin yang dapat membantu anda membuat pelbagai jadual untuk mempersembahkan data anda. Jadi, mari kita membincangkan setiap sumber secara terperinci.

Jadual Coretan jQuery

Ini coretan berguna bersama penjelasan mudah membantu anda membangunkan jadual interaktif. Sebagai contoh, coretan ini membolehkan anda menambah baris secara dinamik, mendapatkan nilai sel, dan sebagainya.

Jadual Penggayaan

Satu set petua dan helah yang membantu dengan gaya jadual anda dengan memperbaiki susun atur, tipografi, penjajaran teks dan banyak lagi. Lebih-lebih lagi, ia juga menceritakan menambah warna dan grafik dan menyesuaikan kapsyen bersama-sama dengan aspek lain dari jadual.

Tiada Lagi Jadual

Potongan yang membantu anda membuatnya jadual responsif mudah alih yang menunjukkan setiap baris secara berasingan pada skrin kecil. Juga, anda boleh menukar warna, font dan saiz fon, dan sebagainya menggunakan CSS.

Badan Jadual Boleh Skrol

Caranya boleh membuat badan meja anda ditukar - ciri yang terdapat dalam kebanyakan alat spreadsheet seperti Helaian Google. Maksudnya, anda boleh menetapkan tajuk jadual dan badan jadual atau kandungan akan tatal, seperti biasa, membuat jadual lebih kelihatan daripada sebelumnya.

Tajuk Jadual Tetap

Satu lagi helah seperti di atas, Header Table Fixed membantu membuat jadual dengan tajuk tetap dan kandungan yang boleh ditelusuri. Awak boleh menyesuaikan jadual termasuk warna dan fon, tetapi helah ini tidak terperinci dan dijelaskan sebagai Badan Jadual Boleh Skrol.

Sorotan Jadual CSS Tulen

Satu helah ringkas yang membolehkan anda menyerlahkan sel tertentu di atas hover - menegak serta mendatar. Juga, jadual akhir adalah peribadi dengan warna dan fon tersuai. Saya dapati helah ini sangat berguna apabila anda perlu menunjukkan nombor di atas meja.

TABLEIZER!

TABLEIZER! adalah alat dalam talian yang membolehkan anda buat jadual kosong dalam HTML menggunakan data dari Excel, Helaian Google, atau mana-mana alat spreadsheet yang lain. Anda juga boleh menyesuaikan jadual akhir menggunakan CSS, sama seperti mana-mana jadual lain dalam HTML.

Penjana Jadual HTML

Penjana Jadual HTML adalah penjana jadual mudah yang membantu anda membuat dan menyesuaikan hampir setiap aspek jadual menggunakan pilihan pada skrin. Apa yang saya suka ialah anda boleh membuat jadual secara manual, memuat naik fail CSV, atau mengimport data dari alat spreadsheet seperti Excel. Anda juga boleh gaya jadual dengan memilih tema dari set templatnya.

Quackit HTML Generator Table

Satu lagi penjana jadual dalam talian yang membantu anda membuat jadual dengan satu set pilihan customizability. Gaya itu pilihan termasuk saiz, warna, sempadan, dll. Walau bagaimanapun, pilihan untuk mengimport data hilang, tidak seperti penjana jadual di atas.

Jadual Rapid HTML Generator Table

Penjana Jadual HTML oleh Jadual Pantas adalah alat lain seperti kedua-dua alat di atas. Ia menyediakan pilihan penyesuaian yang lebih banyak daripada alat di atas, seperti saiz, sempadan, warna, penjajaran, dan sebagainya. Walau bagaimanapun, seperti alat di atas, ia hanya menyokong mewujudkan jadual secara manual dan tidak membenarkan untuk mengimport fail atau mengambil data dari alat spreadsheet seperti Google Docs.

Styler Jadual HTML

Alat penyesuaian jadual, HTML Table Styler, membolehkan anda gaya menggunakan jadual anda opsyen pada skrin yang menghasilkan CSS untuk jadual anda dalam HTML. Alat ini, menghairankan, menunjukkan pratonton langsung jadual, membolehkan anda menguji dan mencuba pilihan gaya. Juga, ia menawarkan tema untuk gaya cepat jadual, yang anda boleh menyesuaikan juga.

Alat Penukaran

Alat Penukaran ialah a laman web berguna untuk sesiapa sahaja yang berurusan dengan jadual dan spreadsheet setiap hari. Ia membantu anda menukar jadual HTML ke fail CSV, fail Excel ke jadual HTML, fail Excel ke fail CSV, dan melakukan lebih banyak penukaran.

Jadual HTML ke Penukar Penukar

Alat penukar dalam talian, Jadual HTML ke Penyukat Div membolehkan anda menukar jadual tradisional ke jadual div, iaitu, jadual yang dibuat menggunakan elemen 'div'. Yang perlu anda lakukan ialah salin dan tampal jadual pada halamannya dan tekan butang yang ditukar untuk menghasilkan jadual div.

Handsontable

Handsontable adalah komponen spreadsheet inovatif untuk apl web yang membolehkan anda mengembangkan dan menawarkan hamparan dengan pantas dalam aplikasi anda. Ia menawarkan pelbagai ciri seperti sokongan untuk pelbagai rangka kerja, prestasi tinggi dengan jumlah besar data, keupayaan yang diperlukan seperti mencari, menapis, dan lain-lain, yang membolehkan pemaju membina dengan cepat.

Dynatable.js

Plugin meja interaktif, Dynatable.js menggunakan HTML, jQuery, dan JSON untuk membuat jadual dan struktur seperti jadual lain. Anda boleh membuat jadual terus dari JSON dan memasukkan semua fungsi penting seperti carian, penapis, kiraan rekod, dan penomboran.

Jadual Bootstrap

Jadual Bootstrap ialah versi lanjutan jadual yang ditawarkan dengan Bootstrap. Ia meminimumkan masa dan usaha anda dalam membuat jadual dan menyediakan reka bentuk responsif. Ia membawa ciri-ciri seperti tajuk boleh bergulir dan tetap dan fungsi seperti jenis, penomboran, dan lain-lain.

List.js

List.js adalah plugin JavaScript yang ringkas dan berkuasa yang membolehkan anda membuat senarai dan jadual dengan ciri fleksibiliti dan berfungsi seperti penapis, carian dan jenis, dan lain-lain. Saya suka bahawa ia dibina menggunakan JavaScript vanila, jadi anda tidak memerlukan mana-mana perpustakaan pihak ketiga.

jExcel

jExcel adalah plugin jQuery ringan yang membolehkan anda menyemai sebarang spreadsheet yang serasi dengan Excel dalam halaman web anda. Plugin ini membantu dalam membuat jadual seperti Excel, membiarkan anda bergerak, mengubah saiz, menyalin, menampal, dan melakukan lebih banyak dengan data lembaran.

DataTables

Plugin super fleksibel untuk jQuery, Jadual Data membolehkan anda menambah kawalan interaksi maju ke mana-mana jadual HTML. Ia membantu anda menambah penomboran, ciri carian, tema, dan lain-lain. Juga, ia menyediakan sebilangan besar sambungan untuk menambah lebih banyak fungsi.

jQuery Bootgrid

jQuery Bootgrid adalah plugin yang anggun dan intuitif untuk membuat dan mengurus grid seperti jadual. Ia menyediakan ciri-ciri seperti carian, penomboran, dan lain-lain bersama-sama dengan templat disesuaikan.

jQuery-Tabledit

jQuery-Tabledit adalah editor dalam talian untuk jadual HTML serasi Bootstrap yang membolehkan pengguna mengedit data dalam jadual. Anda boleh menyediakan butang untuk bertukar antara mod pandangan dan edit, termasuk memadam dan memulihkan butang, dan menyesuaikan jadual menggunakan CSS.

jsGrid

jsGrid adalah plugin jQuery ringan yang membantu membuat dan menguruskan grid data. Ia menyokong pelbagai operasi pada grid seperti penapisan, paging, sorting, dll. Ia juga membolehkan anda menyesuaikan penampilan meja dan menyokong pengantarabangsaan juga.

Jadual Pintar

Perpustakaan yang mantap, Jadual Pintar membantu anda mengubah mana-mana jadual HTML ke yang lebih pintar dengan pilihan seperti penapis, cari, semak, dan lain-lain Ia ditambah pula dengan lebih banyak ciri untuk membantu membina jadual yang berguna dan profesional atau grid data dengan pluginnya.

HighchartTable

HighchartTable auto-menukar jadual HTML ke dalam carta dan graf. Ia sesuai untuk mewakili analitik dan statistik projek dalam graf bersama data berangka dalam jadual.

TableExport

TableExport adalah perpustakaan mudah untuk mengeksport jadual HTML ke fail CSV, TXT, atau Excel. Menggunakan perpustakaan ini, anda boleh membina meja dengan mudah dengan ciri eksport ke fail.

Tabulator

Tabulator adalah plugin jQuery untuk mewujudkan jadual interaktif dari jadual HTML, array JavaScript, JSON, dan lain-lain Ia menyokong hampir semua fungsi jadual standard seperti carian, jenis, penapis, dan lain-lain dan menawarkan banyak ciri seperti tema, panggilan balik, dan penyetempatan.

FancyGrid

Perpustakaan grid, FancyGrid membolehkan anda membuat jadual yang indah bersama carta dan graf. Ia menyokong banyak sumber data termasuk JSON, termasuk pelbagai fungsi seperti menyusun, mencari, dan sebagainya, membolehkan melukis dan modularization, dan membawa banyak lagi ciri.

KingTable

KingTable membolehkan anda membina jadual pentadbiran dengan pengekodan minimum. Ia datang dengan jumlah ciri yang luar biasa termasuk carian pelanggan, atau pelayan-side, sort, filter, dan fungsi yang lebih umum. Anda boleh menyesuaikan rupa dan nuansa meja, tambah penapis tersuai, dan mengeksport data ke pelbagai format seperti CSV, JSON, dan Excel.

stacktable.js

Plugin jQuery untuk jadual, stacktable.js membolehkan anda menukar mana-mana jadual yang kelihatan luas ke jadual utama / nilai 2-lajur. Ia adalah penyelesaian yang sesuai untuk memaparkan jadual besar pada skrin kecil seperti peranti mudah alih. Juga, anda boleh menampal baris atau lajur yang diperlukan.

Tabella.js

Tabella.js membantu anda membina jadual responsif dengan tajuk tetap dan data bergulir - walaupun secara mendatar untuk memasukkan banyak lajur daripada biasanya. Selain itu, anda boleh termasuk berbilang jadual pada halaman yang sama dan juga membuat jadual pelbagai guna.

TablePress

TablePress adalah plugin hebat untuk WordPress yang membolehkan anda buat dan benamkan jadual ke jawatan, halaman, dan widget teks menggunakan shortcode. Jadual-jadual boleh diedit dalam antara muka seperti spreadsheet dan boleh mengandungi semua jenis data termasuk formula juga. Anda juga boleh menambah ciri seperti carian dan menyusun dan mengeksport data ke pelbagai format.

Penjana Jadual Data oleh Supsystic

Penjana Jadual Data membantu dalam membuat dan menguruskan jadual terus dari panel admin menggunakan editor meja hadapan. Anehnya, anda juga boleh memasukkannya carta dan graf dalam jadual anda bersama dengan kapsyen, header, dan footer. Apa yang saya dapati lebih menarik ialah jadualnya boleh disunting sepenuhnya serta boleh dieksport ke format CSV, Excel, atau PDF.

Jadual Harga oleh Supsystic

Satu lagi plugin oleh Supsystic, Jadual Harga membolehkan anda membuat jadual harga tanpa sebarang halangan. Awak boleh pilih templat, edit kandungan harga, dan siarkan di WordPress anda. Juga, jadual yang dibuat menggunakan plugin ini responsif serta elegan pada semua peranti.

Jadual Responsif Magic Liquidizer

Satu jadual jadual untuk WordPress, Jadual Responsif Magic Liquidizer mengubah mana-mana jadual biasa ke dalam jadual responsif mudah alih. Anda boleh memasukkan imej, teks, dan lain-lain dalam jadual anda dan menunjukkannya pada semua peranti - walaupun mereka yang mempunyai skrin kecil.

Boleh ditakrifkan

Copytables adalah lanjutan untuk Google Chrome yang membolehkan menyalin jadual dari laman web. Awak boleh pilih sel jadual, baris, atau lajur pada mana-mana halaman web, dan salinnya secara langsung .