Introduction to knowledge points involved in checkbox selection_javascript skills

1. It works in IE, but not in Firefox

IE version

Copy code The code is as follows:

Firefox version

Copy code The code is as follows:

Cause analysis: window.event can only be run under IE, so running js under Firefox will not work. In the Firefox version, the selected status of the checkbox with "id=all" is directly obtained, and then assigned to each item of the checkbox group of "name=str", so that the selection status can be kept synchronized.

2. The difference between document.getElementById() and document.getElementsByName()

The above js obtains the status of the checkbox in two ways. From the name Look, their functions should be similar, one gets the element through id, and the other gets the element through name. However, there are differences between the two methods. If you don't pay attention during use, you may think that they can be used interchangeably, which will cause confusion. I thought at the time that I could just use any one, but after changing the name, the js code didn't work. In fact, it was because I didn't understand it, so I used it wrong.

(1) document.getElementById() accesses a specific element through id. Because the id is unique in a page, this function returns an Element

(2) document.getElementsByName() accesses elements through name, because name is not unique in a page and can have the same name, so this function returns a set of Elements

precisely because one is an element and the other is Arrays, so if you don’t pay attention when mixing them, errors will occur, causing js to fail to run. For example, when I changed a[i].checked=document.getElementById("all").checked; to a[i].checked=document.getElementsByName("all").checked;, js could not run. Function (because js makes an error but does not report an error, it feels like it has no effect). In fact, it is not that it is not recognized here, but because it is used incorrectly when calling. The correct way to write it is a[i].checked=document.getElementsByName("all ")[0].checked; After changing it like this, the effect will be the same. Because there is only one checkbox with "name=all" in our page, we use [0] to get the first element in Elements, that is, we pass a[i].checked=document.getElementById("all") .checked;The element obtained.