こんにちは、しきゆらです。
今日は、JavaScriptでフォームのデータを簡単に取得したり、XMLHttpRequestなどで送信しやすいFormDataオブジェクトに触れたら便利だったので、メモしておきます。
formタグのデータをJSで取得し、それに追加して他のデータを送りたい場合などはよくあると思います。
そんな時は、formの中にhiddenでinput要素を配置するとか、方法はいくつかあると思います。
でも、HTML的にはhiddenの要素は意味がないので、データの扱いはJSだけで完結していたいですよね。(個人的な意見です)
そこで使えるのがFormDataというもの。
formタグの中身をそのままkey, valueの組み合わせで表現できる魔法のようなオブジェクトです。
簡単な使い方をまとめておきます。