IE: document.getElementById () bug to keep in mind
Information about the problem, which will be discussed, will certainly be useful to anyone who recently began to delve into the depths of JavaScript and cross-browser compatibility. Consider the following code:
and test it in different browsers. In Firefox, Safari, Opera, Konqueror, Chrome, this code gives what is intended - alert with the text Description's value is 'test value' . But not in IE - there will be a banal runtime error.
So, another sad truth about IE: the document.getElementById () function, which results in prototype-all $ F () , does not work correctly. If the element has the name attribute, then its value will be used when searching by ID, even if the ID itself is also explicitly specified. Therefore, from the point of view of IE, in this example there are two elements in the DOM with ID = “description”, and the first one is the META tag, which will be returned. By the way, I used the META tag in the example not by chance - it was in this case that I stepped on this rake for the first time, and when you start looking for a mistake with your eyes, META is somehow not very noticeable. :)
This problem is old and it seems that it will remain so - according to rumors, this bug is not fixable, since fixing it will break the backward compatibility, no matter how strange it may sound :) By the way, for those who are just starting to tinker with IE: debug JS in IE is most convenient (in my experience) using the Microsoft Script Editor , which must be installed separately. Also worth mentioning is Firebug Lite , but its capabilities are limited.
<Html>
<HEAD>
<meta name = "description" content = "Description of the Web site goes here.">
<SCRIPT src = "http://www.prototypejs.org/assets/2008/9/29/prototype-1.6.0.3.js"> </ SCRIPT>
</ Head>
<BODY>
<FORM name = "test">
<INPUT type = "text" name = "description" id = "description" value = "test value">
</ Form>
<SCRIPT>
Event.observe (window, 'load', function () {
alert ("Description's value is '" + $ F (' description ') + "'");
});
</ SCRIPT>
</ Body>
</ Html>
and test it in different browsers. In Firefox, Safari, Opera, Konqueror, Chrome, this code gives what is intended - alert with the text Description's value is 'test value' . But not in IE - there will be a banal runtime error.
So, another sad truth about IE: the document.getElementById () function, which results in prototype-all $ F () , does not work correctly. If the element has the name attribute, then its value will be used when searching by ID, even if the ID itself is also explicitly specified. Therefore, from the point of view of IE, in this example there are two elements in the DOM with ID = “description”, and the first one is the META tag, which will be returned. By the way, I used the META tag in the example not by chance - it was in this case that I stepped on this rake for the first time, and when you start looking for a mistake with your eyes, META is somehow not very noticeable. :)
This problem is old and it seems that it will remain so - according to rumors, this bug is not fixable, since fixing it will break the backward compatibility, no matter how strange it may sound :) By the way, for those who are just starting to tinker with IE: debug JS in IE is most convenient (in my experience) using the Microsoft Script Editor , which must be installed separately. Also worth mentioning is Firebug Lite , but its capabilities are limited.
')
Source: https://habr.com/ru/post/46304/
All Articles