HTMLCollection() 值和名称到 JSON答案

【问题标题】：HTMLCollection() Values and Names to JSONHTMLCollection() 值和名称到 JSON
【发布时间】：2018-03-22 13:50:29
【问题描述】：

问题：

两种形式，在隐藏的 div 中，当您按下相应的按钮时会出现。输入被解析为 JSON 并随请求一起发送。由于不同的原因，我不能使用form 或fieldset 环绕表单，所以我使用了：

form = document.getElementById('formularEins').getElementsByTagName('input');

当我仍然能够使用form.elements（在我意识到 IE 的字段集不支持 .elements 属性之前）时，我使用它从输入生成 JSON：

（在这种情况下form = document.getElementsByClassName('formOne')[0];

Const formToJSON = elements => [].reduce.call(elements, (data, element) => {
    if (isCheckbox(element)) {
    //data[element.name] = (data[element.name] || []).concat(element.value);
    data[element.name] = element.value;
  } else if (isMultiSelect(element)) {
    data[element.name] = getSelectValues(element);
  } else {
    data[element.name] = element.value;
  }
}
return data;
},);

问题：

如何将 HTMLCollection 及其项目的输入转换为 JSON？

我尝试了以下不同版本但失败了：

   var formToJSON = function formToJSON(form) {
       for (var i = 0; i < form.length; i++) {
       var item = form[i]; 
       data[item.name] = item.value; }
   };

【问题讨论】：

小注：var formToJSON = function(form) {...}或function formToJSON(form) {...}（或formToJSON = form => {...}），不要在变量函数赋值中重复函数名。
另外，[].reduce.call() 不是很地道（但我知道你为什么这样做——.reduce() 在HTMLCollection 上不存在），但是Array.from(form).reduce({...}) 怎么样。
@msanford 谢谢！ formToJSON = form => {...} 是我所拥有的，但 IE 不知何故无法使用它，所以我将其更改为 var formToJSON = function(form) {...}，但这有点矫枉过正。
请注意，您在该类型的作业中给它的名称将被忽略。尝试使用不同的名称：var a = function b(c) {console.log(c)} 然后b("hello") 将抛出ReferenceError: b is not defined。有点像人们所期望的，但一文不值。另外，很遗憾你不能使用=>。

标签： javascript json htmlcollection

【解决方案1】：

您必须将数据变量定义为对象。试试下面的 formToJSON 函数。

var formToJSON = function(form) {
  var data = {};
  for (var i = 0; i < form.length; i++) {
    var item = form[i];
    data[item.name] = item.value;
  }
  return data;
}

【讨论】：