Question

How come the following happens in the console? or am i misusing the indexOf?

document.forms:

[
<form id=​"form-0" name=​"form-0">​…​</form>​
, 
<form id=​"form-1" name=​"form-1">​…​</form>​
, 
<form id=​"form-2" name=​"form-2">​…​</form>​
]

document.forms.indexOf["form-0"]:

TypeError: Cannot read property 'form-0' of undefined

Answer 1

Document.forms is a collection. If you want the number of a form – as indicated in your comments -, the question remains: at which moment do you want that number? Anyway, you could create an array of forms:

var allforms = document.getElementsByTagName('form'), 
    formsArray = [];
for (var i=0;i<allforms.length;i++){
   if (allforms[i].id.match(/\d+$/)){
       var indexval = parseInt(allforms[i].id.replace(/(.+)(\d+)$/,'$2'),10);
       formsArray[indexval] = allforms[i];
   }
}

Now you have an Array containing references to all forms, and for each form an index value that reflects the form number you gave it via it’s id. So: formsArray[0] contains a reference to forms['form-0'], formsArray[1] to forms['form-1'] etc.