Internet Explorer 11 behaves differently on two machines

Question

I'm running IE 11 on my machine. I have a webpage that uses getElementsByClassName. When I access the webpage on my machine the page is served up and it works fine (it executes getElementsByClassName). If I access the same webpage on a different machine also using IE and it can’t find the method getElementsByClassName. If I save the code served up to the browser on the failing machine and access that, the saved page works fine (it executes elemmentsByClassName works). What is going on? How do I tell the browser to use the version of the DOM or javascript that has getElementsByClassName?

var list = document.getElementsByClassName("mrClickableRow");

See: http://stackoverflow.com/questions/7410949/javascript-document-getelementsbyclassname-compatibility-with-ie — BadZen, May 03 '16 at 18:58
Add `` to `` of your page. Also consider _degrade gracefully_ like `if(!document.getElementsByClassName)...` — Alex Kudryashev, May 03 '16 at 19:30
Depending on how you're using the elements after retrieving them, you might consider using the flexible and backwards-compatible `document.querySelectorAll(".mrClickableRow")` — Thriggle, May 03 '16 at 19:43
Using did the trick. All machines are working correctly now. — Richard W, May 03 '16 at 22:00

score 2 · Answer 1 · answered May 03 '16 at 19:23

2

Make sure that IE is using the correct Document Mode to render your page, if not, it can simulate and older DOM-API which can cause some problems.

Open your Developer Tools by hitting F12 in IE, or selecting it by the settings-menu. Then go to the Emulation-tab and look at the Document Mode-dropdown.

answered May 03 '16 at 19:23

MunchyYDL

351
1
5

While the developer tools are inactive, IE always uses the latest version installed. Or can this be changed somewhere in the settings? – Aloso May 03 '16 at 19:25
1

@Aloso it can vary depending on the compatibility lists, which are specific to a given user profile on a given machine. Any site configured to display in compatibility view will render as if in IE8. – Thriggle May 03 '16 at 19:40

score 0 · Answer 2 · answered May 03 '16 at 19:00

0

document.getElementsByClassName is available from IE 9, are you sure you integrate JS with <script type="text/javascript">?

P.S. Use <script> before the </body> (body closing tag)

answered May 03 '16 at 19:00

Nick Messing

494
5
14

Aloso · Answer 3 · 2016-05-03T19:38:06.587

For compatibility issues, you can use this function.

window.getElementsByClassName = function(node, classname) {
    var a = [];
    var re = new RegExp('(^| )' + classname + '( |$)');
    var els = node.getElementsByTagName("*");
    for (var i = 0, j = els.length; i < j; i++)
        if (re.test(els[i].className)) a.push(els[i]);
    return a;
}

if (!document.getElementsByClassName) {
    document.getElementsByClassName = function(className) {
        return window.getElementsByClassName(document.body.parentNode, className);
    };
}

But be aware that this function and the built-in function are slightly different: When you use the built-in document.getElementsByClassName function, it returns an HTMLCollection. If you then delete the class of an element contained in the HTMLCollection, it is also removed from the HTMLCollection.

Internet Explorer 11 behaves differently on two machines

3 Answers3