Adding the name attribute causes the ID value to become a property of the document object in IE and Opera?

Question

Consider this HTML source code:

<form id="foo1" name="x"> Form 1 </form> <form id="foo2"> Form 2 </form> 

As you can see, we define two FORM elements.

In Chrome, Safari, and Firefox, both document.foo1 and document.foo2 returned undefined .

However, in IE and Opera, document.foo1 returns a reference to the corresponding FORM element, while document.foo2 returns undefined .

Live demo: http://jsfiddle.net/zrmEm/2/

So, the first form has its own ID-name property in the document object, and the second form does not. And this difference is in adding the name attribute to the first form.

Now where is the logic in this? Is this behavior known?

Answer 1

In all browsers, the value of the form name attribute is added as a property of the document object, as well as a property of the document.forms collection.

If you use identifiers, values ​​are added only as properties of the form collection.

IE has always been confused with name and identifier attributes. In IE (version 8 verified), an identifier adds a document property only if there is also a name for this form (it can be the same or different from the identifier).

So, if you always use document.forms ['name-or-id'], then life is sweet. Until you have forms with names that match other forms with identifiers, then all bids are disabled.

Answer 2

This is basically a quirk that Microsoft introduced in the dark days of browser wars. (about IE4)

The end result is that in IE forms will be added as variables to the document area, so you can refer to them as document.form1 .

It was non-standard, but it really didn't matter then (at least not for browser providers).

Many of the non-standard features that were added at that time to one browser or another turned out to be implemented by others, became de facto standards and ultimately turned out to be official standards.

This feature, however, did not. It remains non-standard.

Microsoft retained most of its old non-standard functionality even in new versions of its browser in order to maintain backward compatibility for the old code (many corporate intranets were written by experts trained at Microsoft and use these functions, so they need to store them, otherwise no one can update IE6).

In those days, Opera was a young contender in the world of browsers. It was frequently updated, had innovative features and worked much faster than the competition. They then made the world for the browser, which Chrome is doing recently.

However, due to the escalation of the standards war, the only way Opera could compete was compatibility, and they did a lot to redesign all the features (and even in some cases errors) in IE so that sites written for IE would also work in Opera .

This was one of these features, and that's why IE and Opera use the same quirk today.

Other browsers on the market today do not have the same story. Firefox is ultimately derived from Netscape Navigator, therefore, although it may have its own features related to those days, it will not transmit IE. And webkit browsers have a much more recent provenance (derived from the KDE Project KHTML engine), so it never had a history where it tried to emulate IE quirks.