IE9 equivalent of querySelectorAll
Asked Answered
H

3

5

I haven't had any problems in FF or Chrome, but IE9 chucks an error on this method. I thought I would be able to use it, due to it having been shown to be supported here:

http://www.quirksmode.org/dom/w3c_core.html

However, that appears to not be the case in practice. That being said, what can I use in its place?

EDIT: Here's the exact line it fails on:

var maximize_buttons = document.querySelectorAll(".maximize");

That is the first time I attempt to use querySelectorAll(). The browser version number is 9.0.8112.16421

EDIT (again): I've verified this error on two separate computers. However, there's one thing in common that they share - they're both running Windows 7 on VMware. Is that relevant?

Browser mode was IE9, but document mode was set to quirks by default. Changing it to Internet Explorer 9 standards fixed the problem, but if quirks is default, I still need to make it work for that.

Higgle answered 1/11, 2012 at 5:4 Comment(7)
IE 9 does support qSA in standards and quirks mode, what browser are you using? Try alert(typeof document.querySelectorAll);Furcate
What does your selector look like? It may be using a selector not supported by IE9.Sheepcote
Question edited with more details. That alert gives me 'undefined'.Higgle
Are you testing on a page that has Compatibility Mode enabled? If IE is emulating IE 7, it will behave exactly like this.Dramshop
Browser mode was IE9, but document mode was set to quirks by default. Changing it to Internet Explorer 9 standards fixed the problem, but if quirks is default, I still need to make it work for that.Higgle
@Higgle Quirks isn't the default, if you're marking up your pages correctly. Do you have a doctype?Sheepcote
I'd neglected that. Setting a doctype fixed it no problem.Higgle
K
6

You need to use the html5 doctype for IE9 to work with the querySelectorAll() javascript method. The doctype looks like this and should be placed as the first line on all the pages in your site.

<!DOCTYPE html>
Kozloski answered 14/11, 2012 at 22:49 Comment(1)
Actually, this is not the whole truth. Any fully qualified DOCTYPE will work, not only the HTML5 doctype. The browser must only be in standards mode.Nebo
E
5

This has nothing to do with quirks vs. standards mode, as the other answers suggest.

It has to do with so-called "Compatibility Mode." IE9 through IE11 use "Compatibility Mode" with intranet sites by default, and with other sites according to your settings.

To tell IE that your site actually uses web standards and it shouldn't hobble itself, either:

  1. Update your server config to send the X-UA-Compatible header with the value IE=Edge, or

  2. Add it as a meta tag right at the top of your head element markup:

    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    

Of course, you should have a doctype as well, but just a doctype won't deal with the (in)Compatibility Mode issue.

Elanaeland answered 11/12, 2015 at 12:37 Comment(1)
Thanks. In my testing case the meta should be before calling js code.Walz
A
3

Running quirksmode is like running non-standard IE6.

You must, must, must(!) have a doctype on top of each HTML page: <!doctype html>
Every relevant (and many irrelevant) browser supports it.
And without it... ...well... quirksmode...

You don't want to be running in quirksmode for anything, ever, as you never know what kind of JS/CSS/html5 support is suddenly going to disappear or act weird...

So don't do it.

Alisonalissa answered 14/11, 2012 at 23:33 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.