Hide/show, looking for Good Tuts

JavaScript
21

oddz:
I’ve got something that mostly works, and I was specifically trying to avoid display: none (but I’m going to talk to Tommy about that… I’ve got a conflict between screen reader users who cant have display: none and sighted keyboarders who prolly would be better off with display: none) but I will look at your code anyway because it’s good to learn.

Actually I have that one and I had abandoned it until I had other things better under my belt, so I had stopped at the stripey tables and inteded to get back to it later…
my problem totally was that I needed to use Core.js to get anything started and I know that if you eventually get through the book you will have basically built Core but I’m a linear person. I can’t use a black box to start, it’s like walking backwards down a path you’ve never been on, and then being asked to walk forward… you’ve seen where you were while walking backwards, so you should know the way back, but my personal retardation doesn’t deal with that well.

However maybe now is the time to get back to that.

Have you tried what Raffles was describing above - getAttribute and setAttribute with class is handled differently in IE - so most people use the element property className instead.

I’m still not sure if that’s the problem or not… I’ve also got a problem with the nodes being wrong in IE and today I had planned to try out the while staement that set nextSiblings until the next node wasn’t whitespace.

Since what I ended up with (which I’m still in the process of trying to “get”) has those statements often wrapped in conditionals I’ll have to see how to add the IE-versions without conflicting with other browsers:
lijst[l].setAttribute(“class”, “verberg”);
lijst[l].className = “verberg”;

If I could just do that then why am I not just using the second line in the first place? Is it safe to just repeat the second line (instead of something like testing for “class” first and feeding className to IE when “class” isn’t supported?
target.setAttribute(‘class’, target.className + classValue);

Actually I started another thread because I didn’t want this one to be too focussed on my particular code. Maybe that was a dumb thing to do : )

22

All browsers support element.className. So it is safer and less painful than faffing about with setAttribute and doing some sort of browser detection, which should be avoided at all costs (since object detection here would be useless).

When you do your while statement to check the nodeType, I would check for a nodeType of 1 instead of 3, as you are not interested in textNodes (3), but you are interested in locating the element node (1):

var el = someDOMElement.nextSibling;
while (el.nodeType !== 1) el = el.nextSibling;