Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
IE7 querySelectorAll polyfill
if (!document.querySelectorAll) {
document.querySelectorAll = function(selector) {
var doc = document,
head = doc.documentElement.firstChild,
styleTag = doc.createElement('STYLE');
doc.__qsaels = [];
styleTag.styleSheet.cssText = selector + "{x:expression(document.__qsaels.push(this))}";
window.scrollBy(0, 0);
return doc.__qsaels;
document.querySelectorAll||(document.querySelectorAll=function(a){var b=document,c=b.documentElement.firstChild,d=b.createElement("STYLE");return c.appendChild(d),b.__qsaels=[],d.styleSheet.cssText=a+"{x:expression(document.__qsaels.push(this))}",window.scrollBy(0,0),b.__qsaels});

connrs commented May 18, 2012

It is untested in IE6 so I haven't mentioned it here. With IE6, you would be limited by which CSS selectors you could take advantage of. I'm working on projects that have a (for progressively enhanced JS) baseline of IE7. Polyfilling querySelectorAll allows me to do some nice element event handlers in projects where jQuery and other selector libraries aren't permitted.

What selectors does this cover?

ptdixon commented Mar 13, 2013

Nice trick. But it only seems to work in Quirks mode.
If I set a then it breaks ?

AliMD commented Apr 26, 2013

What ?! How it work exactly !

AliMD commented Apr 26, 2013

Error ! TypeError: Cannot set property 'cssText' of undefined

I need support for selectors like a:not(:last-child). This polyfill doesn't help me in that area.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment