Geek Answers Handbook

Can't get innerHTML tag on IE8

I'm trying to get innerhtml class name current_page_item [0] ... And this works fine in FF and even in IE9. But in IE 8, there seems to be some JavaScript error in the line " var classelem=document.getElementsByClassName('current_page_item')[0].innerHTML;

I tried to put a warning after the above line. But it does not display the message "Hello again".

Any idea how to solve the browser problem for this? Is this something that document.getElementsByClassName does not work in IE8?

 <html> <head> <script type="text/javascript"> function updatesidebar() { alert("Hello"); var classelem=document.getElementsByClassName('current_page_item')[0].innerHTML; alert("Hello again"); } </script> </head> <body> <div id="main"> <div class="menu_main"> <ul class='mainmenu' id='root'> <li><a href="/home" class="">Home</a></li> <li><a href="/solutions" class="">Solutions</a> </li><li><a href="/services" class="">Services</a></li> <li><a href="/about-us" class="current_page_item">About Us</a></li> <li><a href="/news" class="">News and Events</a></li> <li><a href="/careers" class="">Careers</a></li> <li><a href="/contact-us" class="">Contact Us</a></li> </ul> </div> </div> <script type="text/javascript"> window.onload=updatesidebar(); </script> </body> </html>
+4
source share
5 answers

getElementsByClassName incompatible in IE8. this is part of HTML5

+1
source

Not all browsers support getElementsByClassName , although the situation is improving. You can use a function that checks its own implementation and uses it if it is found, or it captures all the elements and checks each of them for the class name, returning an array of those that match.

 function getElementsByClassName( className, context ) { //the context is the container we will confine our search to (optional) context = context || document; //use native implimentation if it exists if( context.getElementsByClassName ) { return context.getElementsByClassName( className ); //returns a nodeList } //we have to do it ourselves if we get here var candidates = context.getElementsByTagName( '*' ); var found = []; //regular expression to match the classname as per comments var rxp = new RegExp( "(?:^|\\s)" + className + "(?:\\s|$)"); for( var i = 0, l = candidates.length; i < l; i++ ) { if( rxp.test( className ) { found.push( candidates[i] ); } } return found; //returns an array of nodes }
+3
source

Edit:

 window.onload=updatesidebar();

in

 window.onload=updatesidebar;

How you do it now will call the function immediately, not when the page is loaded.

+1
source

getElementsByClassName is not a native JS function, you must reference any library, including its

+1
source

you do not need to change the code, but you can add this function if it does not exist ...;)

 if (typeof document.getElementsByClassName!='function') { document.getElementsByClassName = function() { var elms = document.getElementsByTagName('*'); var ei = new Array(); for (i=0;i<elms.length;i++) { if (elms[i].getAttribute('class')) { ecl = elms[i].getAttribute('class').split(' '); for (j=0;j<ecl.length;j++) { if (ecl[j].toLowerCase() == arguments[0].toLowerCase()) { ei.push(elms[i]); } } } else if (elms[i].className) { ecl = elms[i].className.split(' '); for (j=0;j<ecl.length;j++) { if (ecl[j].toLowerCase() == arguments[0].toLowerCase()) { ei.push(elms[i]); } } } } return ei; } }
0
source

More articles:


All Articles