运行for循环以在JavaScript中打印输入框的类型

Question

I have this idea that I wanted to try out. I have a form which has a certain number of input elements inside it. I want to run a function that will print out the type of the input elements using two for loops. Here is the code that I tried out

                  function check(){         
                     var i = document.forms.length;
                     var j = document.forms[i-1].elements.length;
                    //alert(i);
                   //  alert(j);
                    for (var k=0; k<=i;k++){
                    //alert(l);
                         for (var l=0;l<=j;l++){  
                          //alert(l);
                          alert(document.forms[k].elements[l].type);
                          }
                      }
                  }  

The code only prints out the type of the first element in the form. What am I doing wrong ?

Answer 1

get all the forms in your page, loop thru each forms, inside first loop get the elements specific to the form which is currently being iterated, loop thru the elements and get the type, try doing:

var frms = document.forms;
for(var f = 0; f < frms.length; f++ ) {
    var elems = frms[f].elements;
    for(var e = 0; e < elems.length; e++ ) {
        console.log( elems[e].type );
    }
}

Demo:: jsFiddle

Answer 2

Can you use querySelectorAll ?

var elems = document.querySelectorAll("form input");
for(var i in elems) {
  console.log(elems[i].type);
}

If not, you need to count the elements for the form inside your first for loop:

function check(){         
  var i = document.forms.length;       
  for (var k=0; k<i;k++){
    // Check the element length here
    var j = document.forms[k].elements.length;
    for (var l=0;l<j;l++){  
      alert(document.forms[k].elements[l].type);
    }
  }
 }  

Answer 3

I tried your script and works well with the following modifications:

First Loop for (var k=0; k<=i-1;k++) {

Second Loop for (var l=0;l<=j-1;l++){

Otherwise you have an error cause all loops are executed +1 times.

Answer 4

I wrote simple jsfiddle example - http://jsfiddle.net/REb64/

      function check(){   
        for (var i=0; i < document.forms.length; i++){
          for (var j=0; j < document.forms[i].elements.length; j++){
            alert(document.forms[i].elements[j].type);
          }
        }
      }