JSで簡単に表を転置できる方法

2023/05/27 09:56

このQ&Aのポイント

JavaScriptを使用して簡単に表を転置する方法をご紹介します。
表の列と行を入れ替えることで、表を転置することができます。
Vanilla JSを使用し、jQueryを必要としません。チェックボックスでトグルすることも可能です。

retorofan
お礼率86% (336/388)

JavaScript
回答数1
ありがとう数1

みんなの回答 （1）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

babu_baboo
ベストアンサー率51% (268/525)

2023/05/27 12:41 回答No.1

<!DOCTYPE html> <head> <meta charset="utf-8"> <title></title> <style></style> <body> <div><input type="checkbox" id="menu" onclick=" let A=a=>[...a.rows].map(a=>[...a.cells]), B=a=>a[0].map((_,i)=>a.map(b=>b[i])), C=(a,b=document.createElement('tbody'))=>a.reduce((a,b)=>(a.insertRow().append(...b),a) ,b), D=table2.tBodies[0]; D.replaceWith((C(B(A(D))))); " >転置</div> <div class="container"> <table id="table2" border="1"> <caption>世界の高い山トップ10</caption> <tbody> <tr><th>順位<th>山の名称<th>標高 (ｍ) <tr><td> 1位<td>エベレスト<td>8,848 <tr><td> 2位<td>Ｋ２<td>8,611 <tr><td> 3位<td>カンチェンジュンガ<td>8,586 <tr><td> 4位<td>ローツェ<td>8,516 <tr><td> 5位<td>マカルー<td>8,485 <tr><td> 6位<td>チョ・オユー<td>8,201 <tr><td> 7位<td>ダウラギリ<td>8,167 <tr><td> 8位<td>マナスル<td>8,163 <tr><td> 9位<td>ナンガ・パルバット<td>8,126 <tr><td>10位<td>アンナプルナ<td>8,091 </tbody> </table> </div>