Question

I have a JavaScript issue when the page is viewed in IE only. I get this:

object doesn’t support this property or method

The line in my JavaScript code that generates this error is:

var panels = $('collapser').getElements('div.menuTable');

The above code is trying to get all div elements with the class menuTable within the collapser element.

Seems like IE doesn’t like the getElements method!

Here’s is the relevant part of the page in HTML:

<div id="collapser" class="text2"> 
    <h2 class="menu">system features1</h2> 
    <div id="div145fgjd584rgd" class="menuTable">
     ...
    </div>
    <h2 class="menu">system features2</h2> 
    <div id="div2sf54685454rtyt" class="menuTable">
     ...
    </div>
</div>

Answer 1

in IE 6, 7 and 8(in part), the Element.prototype is verbotten or elements just don’t benefit from changes to their prototype.

As a workaround, MooTools add copies all Element.prototype methods to each IE element object when it gets accessed through a selector ($, $$) or when it is being created (Element constructor).

Basically: $("collapser") or document.id("collapser") or new Element('div#collapser') will also copy the methods and setup element storage etc–it’s a one-off operation.

Which leads me to believe that the $() function that you have is NOT the mootools one.

For example:

this.$ = document.getElementById;
$("collapser").getElements("div"); // exception in IE6/7/8

what version of mootools is it? console.log($); // is it the mootools one?

you can also do:

var panels = document.getElements('#collapser div.menuTable');