연관배열 - Plunker

<!DOCTYPE html>
<html>
  <head>
    <title>연관 배열</title>
    <script>
      //폼 요소의 이름과 값 구하기
      function getVals(){
        var elems = document.getElementById("picker").elements;
        var elemArray = new Object();
        for(var i=0;i<elems.length;i++){
          if(elems[i].type == "text")
            elemArray[elems[i].id] = elems[i].value;
        }
        checkVals(elemArray);
        return false;
      }
      
      //값 확인
      function checkVals(elemArray){
        var str = "";
        for(var key in elemArray){
          str+=key+","+elemArray[key]+" ";  
        }
        document.getElementById("result").innerHTML = str;
      }
    </script>
  </head>

  <body>
    <form id="picker" onsubmit="return getVals()">
      <label>값 1:</label> <input type="text" id="first" /><br />
      <label>값 2:</label> <input type="text" id="second" /><br />
      <label>값 3:</label> <input type="text" id="third" /><br />
      <label>값 4:</label> <input type="text" id="four" /><br />
      <input type="submit" value="유효성 검사" />
    </form>
    <div id="result"></div>
  </body>
</html>