ソート機能がある表の作成(JS前提)
とりあえず grid.js がシンプルで分かりやすいかな？ リファレンス Grid.js Data Tables 比較記事 10 Data Table Libraries for JavaScript in 2024 Grid.jsの例(index.html) Grid.jsによる表(デモ) ソースコードは、こちらのindex.htmlを参照 <html> <head> <title>P.A.Works - test of data table - </title> <link href="https://cdn.jsdelivr.net/npm/gridjs/dist/theme/mermaid.min.css" rel="stylesheet" /> <script src="https://cdn.jsdelivr.net/npm/gridjs/dist/gridjs.umd.js"></script> </head> <body> <div id="gridContainer"></div> <script> new gridjs.Grid({ columns: ['放映年', '番組名', '備考'], search: true, // 検索 sort: true, // ソート pagination: { // ページネーション limit: 10 }, data: [ ["2008","TRUETEARS",""], ["2011","花咲くいろは","お仕事シリーズ第1段"], ["2012","TARITARI",""], ["2013","花咲くいろは劇場版",""], ["2013","凪のあすから",""], ["2014","グラスリップ",""], ["2015","SHIROBAKO","お仕事シリーズ第2段"], ["2017","サクラクエスト","お仕事シリーズ第3段"], ["2018","さよならの朝に約束の花をかざろう",""], ["2018","色づく世界の明日から",""], ["2020","SHIROBAKO劇場版",""], ["2021","白い砂のアクアトープ","お仕事シリーズ第4段"], ["2023","駒田蒸留所へようこそ","お仕事シリーズ第5段"], ], }).render(document.getElementById('gridContainer')); </script> </body> </html>