The most common compatibility problems that dom| access to Web browsers, such as Firefox and other gecko engines, are the differences between IE DHTML and the consortium DOM.
One of the easiest bugs in nonstandard DHTML scripts is to use an irregular way to access page elements. We have used spider to climb some well-known domestic portal sites, in terms of quantity, more than 95% of the JavaScript errors come from this.
Common ways to access page elements are not standardized:
1. Access the page element directly with the ID or Name property name, for example:
<div id= "Icefable1" >...</div>
<script language= "JavaScript" >
icefable1.style.width=0;
</script>
The right thing to do is to use getElementById to come to an element with an id attribute, using Getelementsbyname to get some element with the name attribute. For example, the above code can be changed to:
<div id= "Icefable1" >...</div>
<script language= "JavaScript" >
document.getElementById ("Icefable1"). style.width=0;
</script>
2. Page elements that add the same ID to a Web page. For example:
<TD width= "33%" class=tab-on Id=navcell Onmouseover=switchcell (0) ><div align= "center" > Important Tips </div> </td>
<TD width= "33%" Class=tab-off Id=navcell Onmouseover=switchcell (1) ><div align= "Center" > Academic Activities </div> </td>
<TD width= "34%" Class=tab-off Id=navcell Onmouseover=switchcell (2) ><div align= "center" > Jiaotong University Hot </div> </td>
...
<script language= "JavaScript" >
...
Navcell[n].classname= "Tab-on";
...
</script>
The specified ID in the HTML standard must be unique in a Web page, and if you want to access a set of elements at once, you can use the Name property for elements that support the name attribute, and name can be unique. The above example can be read as follows:
<TD width= "33%" class=tab-on id= "navcell1" Onmouseover=switchcell (0) ><div align= "center" > Important Tips </div ></td>
<TD width= "33%" Class=tab-off id= "Navcell2" Onmouseover=switchcell (1) ><div align= "Center" > Academic Activities </div ></td>
<TD width= "34%" Class=tab-off id= "Navcell3" Onmouseover=switchcell (2) ><div align= "center" > Jiaotong University hotspot </div ></td>
...
<script language= "JavaScript" >
...
Eval (' document.getElementById ("Navcell ' +n+ '). Classname=" tab-on ");
...
</script>
Someone's been writing for a lifetime. DHTML doesn't know what the difference is between ID and name, because IE never helped them understand it. Do you thank IE for "compatibility"? I don't.
3. Use the All property, such as document.all, to access the page elements. The All property is a proprietary property of IE DHTML that can be accessed by accessing the page elements in the following ways:
The standard practice is to use getElementById or getelementsbyname.
