JavaScript document.forms[0] and getelementbyname distinguish _javascript skills

First, let's look at an example:

Copy Code code as follows:

<form name= "Buyerform" method= "post" action= "/mysport/control/user/list.do" >
<input type= "checkbox" id= "usernames" value= "Testtest" >testtest<br>
<input type= "checkbox" name= "usernames" value= "Testtest" >testtest<br>
<input type= "text" id= "usernames" value= "Testtest" >testtest<br>
</form>

Document.forms[0] When you have a form form or multiple form forms in an HTML page, you return a form array of nodelist types
Document.forms[0].usernames, here the usernames can be the value of the ID, or the value of name, where the two properties are equivalent. Also, it does not distinguish between a text box, a radio box, or a check box.

to distinguish between two situations ,

There is an input ID or name "usernames" when the document.forms[0].usernames return is the specific input components, then if the operation, you should follow the specific components of the operation method to use.

At this point, alert (document.forms[0].usernames.length) returns the undefined because the input component does not have the attribute length.
When the ID of two or two or more input is named ' usernames ', the Document.forms[0].usernames returns an array of NodeList, at which point the
Alert (document.forms[0].usernames.length) returns the length of the array, in the example above, the return value is 3
So, when using JS to select all, consider the same name check box with one or more cases

Copy Code code as follows:

function Allselect () {
var form = document.forms[0];
var state = form.allselectbox.checked;
var length = form.usernames.length;//Returns the length of an array when there are two or two more check boxes named usernames
When there is a checkbox named usernames, Form.usernames returns a check box object instead of an array, so its length property is undefined
if (length) {//in JavaScript, as long as the condition being judged is 0,null, or undefined, is considered false, other cases are considered true
for (Var i=0;i<length;i++) {
Form.usernames[i].checked=state;
}
}
else{
Form.usernames.checked=state;
}
}

The

has a component ID of ' usernames ' or more than one component ID of ' usernames ', and document.getElementById (' usernames ') returns a single form component. When more than one component ID is ' usernames ', returns the first ID of the ' usernames ' component. The
has a component name of ' usernames ' or multiple component name ' usernames ', and document.getelementsbyname () returns an array of htmlcollection. Notice the difference from the document.getElementsByTagName (), which gets the array based on the label category.
var names = document.getElementsByTagName ("usernames"), alert (names[0)) The result returned here is undefined, I used to confuse byname with Bytagname, and no label started with usernames, <usernames value= ' ></usernames> it doesn't exist.
But getElementsByTagName returns an array collection that contains nothing, names[0] does not exist, so it returns undefined, because when the array is out of range, the values that pop up are undefined.
var test = {' 0 ', ' 1 ', ' 2 ',};alert (test[3]); The return is undefined.