在前端開發(fā)中，我們經(jīng)常需要向后端傳遞表單數(shù)據(jù)。隨著前端技術(shù)的發(fā)展，現(xiàn)在我們有一種更加方便的方式來傳遞表單數(shù)據(jù)，那就是將表單轉(zhuǎn)換成json格式。

// HTML表單
<form>
<label>姓名</label>
<input type="text" name="name">
<label>年齡</label>
<input type="number" name="age">
<label>性別</label>
<select name="gender">
<option value="male">男</option>
<option value="female">女</option>
</select>
<button type="submit">提交</button>
</form>
// 將表單轉(zhuǎn)換成json
const form = document.querySelector('form');
const formJson = {};
for (let input of form.elements) {
if (input.tagName === 'BUTTON') {
continue;
}
formJson[input.name] = input.value;
}
console.log(formJson);
// 輸出
{
"name": "張三",
"age": "20",
"gender": "male"
}

在上面的代碼中，我們首先通過querySelector獲取到表單，然后遍歷表單中的所有元素。在遍歷過程中，我們排除了button元素，因?yàn)樗麄兺ǔ]有需要傳遞的值。最后，我們將每個元素的name作為屬性名，value作為屬性值來構(gòu)造json對象。

通過將表單轉(zhuǎn)換成json格式，我們可以更加靈活地使用表單數(shù)據(jù)。例如，我們可以通過Ajax方式來傳遞表單數(shù)據(jù)，或者將它存儲到LocalStorage中以便下次使用。