Or now to lose the rest of one’s limited hair 🙁 …. I’ve come across a “doesn’t work as expect” issue while working in Prototype 1.6.0.2 JavaScript framework (“Easy Ajax and DOM manipulation for dynamic web applications” for sure!)
1 | $('someIdName').parentNode.childElements() |
works fine in FireFox (v3) but not in Internet Explorer ( v6), in particular it seems the the
1 | $('someIdName').childElements() |
fails giving a “Object doesn’t support this property or method”
thankfully
1 | $('someIdName').siblings() |
worked just fine. 🙂 but I still worried about the Fail.
I think the problem was that in some cases the
1 | "ParentNode" |
was a
1 | "div" |
element and strictly speaking Div’s do have children. Is this a difference in the DOM between IE and FF?
perhaps $(‘someIdName’).parentNode.childNodes would work?
I think the issue is when/how does Prototype add its own methods to DOM nodes in different browsers. (I’m a jQuery person and not a Prototype expert so I may be wildly wrong.)
childElements() and siblings() are Prototype methods and so $(‘id’).childElements() should definitely work. The $() function adds the Prototype methods before returning the element(s).
parentNode is a standard DOM property, so I wouldn’t expect Prototype to add its methods when accessed as $(‘id’).parentNode.
Perhaps you have code that causes Prototype to “touch” the parent node (and thus add its methods) in Firefox but not in IE? Or perhaps Prototype has some other magic that adds its methods in Firefox but not in IE?
This should work in both browsers: $($(‘id’).parentNode).childElements()
(childNodes is an array-like object (a “NodeList”) that includes all child nodes of an element. In standards-loving browsers (not IE) this includes text nodes, which means using childNodes usually requires extra element node checks. This is why all JavaScript frameworks include a “get child elements only” convenience function.)