IE Error: 'parentNode' is null or not an object

[webdeveloper]

Without showing any code, I thought maybe somebody already knows what
the error message in the title generally means?

But in short, a menu is supposed to display by setting its inline style
attribute to: display="none" vs 'display="block" upon an onclick of an
"<a>" element. That link ("<a>") element is accessed via DOM by using
something like "this.parentNode.childNodes[2].style.display="none", or
"block" to display a menu below it.
The code works in Firefox, and the menu shows up & hides, but IE6 gives
this error, despite that it's supposed to support the 'parentNode'
property. What could it be?

-Help's appreciated.

 

[RobG]

Without showing any code, I thought maybe somebody already knows what
the error message in the title generally means?

But in short, a menu is supposed to display by setting its inline style
attribute to: display="none" vs 'display="block" upon an onclick of an
"<a>" element. That link ("<a>") element is accessed via DOM by using
something like "this.parentNode.childNodes[2].style.display="none", or
"block" to display a menu below it.
The code works in Firefox, and the menu shows up & hides, but IE6 gives
this error, despite that it's supposed to support the 'parentNode'
property. What could it be?

If the onclick event was attached using attachEvent, then likely in IE
the function's this value is the global/window object, and not the
element. In Gecko et al, presuming you've used addEventListener, it
refers to the element.

 

[ASM]

webdeveloper a écrit :

The code works in Firefox, and the menu shows up & hides, but IE6 gives
this error, despite that it's supposed to support the 'parentNode'
property. What could it be?

I don't know about IE (Win)
but all examples bellow work fine in my browsers.

Your method :

<li><a href="11.htm" onclick="
var submenu = this.parentNode.childNodes[2].style;
submenu.display = submenu.display==''? 'none' : '';
return false;
">page 11</a>
<ul>
<li><a href="11a.htm">page 11-a</a></li>
<li><a href="11b.htm">page 11-b</a></li>
</ul>
</li>

My method :

<li><a href="11.htm" onclick="
var submenu = this.parentNode.getElementsByTagName('ul')[0].style;
submenu.display = submenu.display==''? 'none' : '';
return false;
">page 11</a>
<ul>
<li><a href="11a.htm">page 11-a</a></li>
<li><a href="11b.htm">page 11-b</a></li>
</ul>
</li>

Much more complicated :

<li><a href="11.htm" onclick="
var parentMenu = this.parentNode;
while(parentMenu.tagName.toLowerCase()!=('li'))
parentMenu += parentNode;
var submenu = parentMenu.childNodes;
for(var i=0; i<submenu.length; i++)
if(submenu.tagName &&
submenu.tagName.toLowerCase()=='ul') {
submenu = submenu.style
submenu.display = submenu.display==''? 'none' : '';
}
return false;
">page 11</a>
<ul>
<li><a href="11a.htm">page 11-a</a></li>
<li><a href="11b.htm">page 11-b</a></li>
</ul>
</li>

 

[webdeveloper]

Well, thanks; that gives a clue that the code might be correct, at
least. Although some 80% won't be able to use it until I can figure why
IE gives the darn error instead of obeying the DOM. I might repost
(with the code) if I can't figure out a solution.

Thanks

 

[webdeveloper]

It seems that the problem was when refering to the onclick element
itself as document.links.name made it unworkable in IE. When changed
into document.getElementById("id"); it started to work, although with
another issue that I'll describe later.

enjoy the dreams