Forum Moderators: open

Message Too Old, No Replies

DOM getElementById vs. getElementByClass?

is doable coding DOM with getElementByClass?

         

sugar2

4:58 pm on May 17, 2005 (gmt 0)

10+ Year Member



hi, im using this embedded behaviour, but it enforce me to use with a <ul ID=" "> because it use document.getElementById sentences, any idea of how can i edit that code for can be usable for <ul CLASS=" ">, i tried with using of getElementByClass but it didnt work, as you can see im just new to DOM and javascript.

<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

//--><!]]></script>

any help and advice will be apreciated

Bernard Marx

8:17 pm on May 17, 2005 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member




if (window.attachEvent) window.attachEvent("onload", sfHover);
/*? */
else window.addEventListener('load',sfHover,false);
/*
Defined function as named function.
- Assignment statement needn't then
come after definition.
*/
function sfHover()
{
/* Assumed: target class of UL is 'sf' */
var regSfUL = /\bsf\b/;
var ULs, UL, LIs, LI, i=j= -1;
ULs = document.getElementsByTagName("ul");

/* Loop stops when ULs[n]--> null */
while( UL=ULs[++i] )
{
/* Tested className with RE
- so multiple classNames are handled
RE predefined for extra a fish in sea
*/
if( regSfUL.test(UL.className) )
{
j = -1;
LIs=UL.getElementsByTagName("li");
while( LI=LIs[++j] )
{
LI.onmouseover = over;
LI.onmouseout = out;
}
}
}

/* Defined event handler functions outside the loop
- more efficient (speed & memory).
Kept as inner functions to preserve global namespace
- OK, since outer function is only called once.
If you are paranoid about memory leaks you could
define these externally.
*/
function out()
{
this.className=this.className.replace(/ sfhover\b/, "");
}

function over()
{
this.className+=" sfhover";
}

}

sugar2

9:37 pm on May 17, 2005 (gmt 0)

10+ Year Member



thanks for the reply, also i read the email and downloaded the code...

i will give that a try

thnks