[thelist] DOM and setting attributes

Tom Dell'Aringa pixelmech at yahoo.com
Fri Oct 31 09:50:56 CST 2003


Again related to my current code snippet posted earlier, I am writing
out via the DOM a UL inside a DIV.

Per QuirksMode.org, attributes in the DOM are a "bloody mess" ;P (I
love that.) Anyway, this begs the question how do I write a dynamic
element to the page that NEEDS attributes so it works in all modern
browsers. 

PPK says use setAttribute()/getAttribute() only when x.style.property
isn't available. But I don't see where x.style.property is even
available to me if I am just now creating the element.

So - here's my code and question. I want to dynamically write out a
LI item with a hyperlink. I'm using setAttribute() since it seems to
be the most supported and I can't see how to use x.style.property.
Here is my function:

function BuildMainMenu()
{
	var container = document.getElementById("menuContainer");
	var mainNav = document.createElement("UL");
	container.appendChild(mainNav);
	
	for(var x=0; x<numMain; x++)
	{
		var mainNavItem = document.createElement("LI");
		var navLink = document.createElement("A");
		var navText = document.createTextNode("some text");
		
		navLink.setAttribute("HREF", "/someLink.html");
		
		navLink.appendChild(navText);
		mainNavItem.appendChild(navLink);
		mainNav.appendChild(mainNavItem);
	}
}

This works perfect in Gecko (NS6,7, Moz1) and in Opera, my LI items
show up just fine and they are links, so my css rollover works and
all is happy.

This does not work in IE6 (not able to test 5.5 or 5, assume not
working there either.)

So where am I going wrong and what can I do to fix it so it works in
all browsers? 

Tom



=====
http://www.pixelmech.com/ :: Web Development Services
http://www.DMXzone.com/ :: JavaScript Author / Every Friday!
http://www.thywordistruth.net/ :: Eternal Life

"I'll ho ho and ha ha you!" (Daffy Duck)


More information about the thelist mailing list