SO-73517491

by David Thomas

HTML

<input name='223' type='number' class='form-control score' value='70'>
<input name='224' type='number' class='form-control score' value='65'>
<input name='225' type='number' class='form-control score' value='87'>

JavaScript

// helper utitilies, largely to reduce typing in larger projects;
// caching a reference to document:
const D = document,
  // an alias for querySelectorAll() that accepts an Element as
  // a context within which to search for the supplied selector,
  // defaulting to document:
  get = (sel, ctx = D) => ctx.querySelector(sel),
  // similar to the above, but an alias for querySelectorAll(),
  // and here we convert the NodeList returned from querySelectorAll()
  // into an Array in order to use Array methods:
  getAll = (sel, ctx = D) => [...ctx.querySelectorAll(sel)],
  // simple function to take a selector, retrieves the elements
  // matching that selector and then iterates over the Array of
  // Element Nodes:
  collate = (sel) => getAll(sel).map(
  // using an Arrow function along with destructuring assignment to
  // retrieve the 'name' and 'value' properties of the Element, and
  // passing those into the function body:
  ({
    name,
    value
  }) => {
    // here we return the Object formed from the name variable,
    // and supplying the value property of the Element as the
    // property-value:
    return {
      [name]: value
    }
  }),
  // calling the function on all <input> elements (adjust the selector
  // for more precise control):
  nameAndValues = collate('input'),
// this could also benefit from being converted into JSON:
  nameAndValuesJSON = JSON.stringify(nameAndValues);
  
  console.log(nameAndValues);
  console.log(nameAndValuesJSON);