2022/02/19 配列を返すのに toPlainObject というのは、名前としてはおかしいので toArray に修正。もろもろ修正。
業務で使うために作ったけど、すぐ忘れそうなのでメモ書きです。
テーブル要素、たとえば下記のようなものから、データベースの行配列のようなオブジェクトを作りたい、と唐突に思ったわけです。
| カラム1 | カラム2 | カラム3 | カラム4 | カラム5 |
|---|---|---|---|---|
| 1 | 1 | 1 | 1 | 1 |
| 2 | 2 | 2 | 2 | 2 |
| 3 | 3 | 3 | 3 | 3 |
で、table2json みたいなキーワードでググってみると、いくつか githubとかで見つかります。
・・・が、公開されているのは、すごく汎用性が高くバグも少ないけれど、イヤイヤイヤ、そんな機能要らんねん、とか、こういう事ができたらなぁ・・・とか、いろいろあるわけです。要は、帯に短し、襷に長し、というケースがいろいろ出てきます。
じゃあ、仕方ない、テーブル要素からJSONを組み立てるぐらいなら、数十行のコードだな・・・と思い、書き始めると、時間がかかるわけです。
単純なテーブルなら、すぐ書けたんです。30分ぐらいでしょうか。でも・・・「あ、セルが縦横に合体してるテーブルだと、使えんな・・・」と。
まぁ、ブログの肥やし💦
下記のようなテーブルから、JSONデータ（正確には オブジェクトかな。)を組み立てる。
要は、theadにキー名の列を、tbodyに実際の行があるような、よく見かける表です。
これを下記のようなスクリプトで、オブジェクトに変換します。
単純な関数を1個つくればいいと思ったですが・・・HTMLTableElementにtoJSON,toArrayメソッドを強引に付け足してやりました。
実際の本体は、↓のような感じ。（エラー処理は一切してないので、無いとは思いますが、コピペ使用は危険です）
まぁ、使い方は、テーブル要素のオブジェクトを取得して、toArray()メソッドをコールすると、運が良ければオブジェクトが返ってきます。
toJSONメソッドは、toArrayメソッドの返り値を JSON.stringify しただけ。
fn 引数を指定すると、セルのテキストを加工できます。
デモはこちら
稚拙だなぁ・・・。