Making Internet Explorer 8 (IE8) Suck Less for Native Javascript

TL;DR Version

I’ve written a small library called MakeIE8SuckLess that will implement gaps like document.getElementByClassName so that your native JavaScript will continue to operate on IE8. It’s not complete and I’ll be adding stuff to it over time but you can find at my public GitHub account https://github.com/chris-tomich/mymemorysucks/tree/master/MakeIE8SuckLess .

Why Another JavaScript Library?!?!?

So for a long time now I’ve been using jQuery because IE has made doing JavaScript in the past pretty painful. But as IE entered version 9 to 11 they started to become far more standards compliant and I have started to feel a decrease in needing to use jQuery. It’s not that I dislike jQuery, but clearly there is an overhead to using it. Also I like the feeling of not having to always be depend on an external library.

This Easter weekend I started a new project of mine and decided that I would just use plain, vanilla JavaScript as this project is slightly more graphically intense than other JavaScript projects I’ve worked on. Also with IE7 barely used (according to a few online net statistics sites) and IE8 slowly dwindling in numbers, I’m finally starting to feel that time drawing near when I may not need to use jQuery to help make JavaScript suck less because JavaScript isn’t sucking so bad anymore! 🙂

Of course in the meantime IE8 is still in usage by a large minority so after a quick look around at whether anything just super basic existed. I’ll admit, I didn’t look super hard, but what I did find didn’t really suit what I wanted. All I really wanted was something that would fill in gaps in IE8 by implementing standard properties and method. As such, I decided to start writing my own very small, lightweight library that just fills in gaps in IE8 so that my vanilla JavaScript will at the very least run in IE8 and will do nothing for IE9+ and other conforming browsers. I’m calling this library “MakeIE8SuckLess” and at this point in time it just fills a few basic gaps where IE8 differs to IE9+. I’ve shared the library in GitHub (https://github.com/chris-tomich/mymemorysucks/tree/master/MakeIE8SuckLess) under an MIT license so feel free to download it and use it as you like. If you want to add stuff to it get in contact with me and I’ll give you access to the repository so that you can update it.

The concept behind the MakeIE8SuckLess library is just to fill in gaps where IE8 slightly differs from IE9+. For instance getElementsByClassName is missing so I’ve done a very simple implementation of it (not performance optimised). Another example is that I’ve got a method MakeIE8SuckLess.ByFixingMyMouseEvent(event) where you pass in a mouse event object and it will add missing properties like pageX and pageY and missing methods like stopPropagation() and preventDefault().

My intention is not to make the library complete straight away, but as I identify gaps while I’m working on this new project, I’ll add to it and hopefully others may find it of use.

Usage

Include it in your page as per usual –

<script src="MakeIE8SuckLess.js" type="text/javascript"></script>

Then all that remains to be done is to initialise it (I’m Australian and we spell it with an “s” but if it bugs you at all you change it in your copy of the code 🙂 ).

MakeIE8SuckLess.Initialise()

Reference

MakeIE8SuckLess.ByFixingMyMouseEvent(event)

MakeIE8SuckLess.ByFixingMyElement(element)

  • addEventListener() is added to the element and will just make a call to attachEvent() and prefix the declared event with “on” – this isn’t perfect but for most scenarios should work fine
  • removeEventListener() is added to the element and will just make a call to detachEvent() and prefix the declared event with “on” – again, this isn’t perfect but for most scenarios should work fine like addEventListener()

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s