JavaScript nextSibling Firefox bug fix
Mar
28
After being totally frustrated by what I believe to be a bug in Firefox’s Document Object Model (DOM) I found a very handy fix. Agave Group Design investigated this issue and realised that Firefox counts line breaks as a textNode and therefore can be returned in many situations as the next sibling rather than for example the next div.
The fix was fairly simple in the creation of the following function:
code
function getNextSibling(startBrother){
endBrother=startBrother.nextSibling;
while(endBrother.nodeType!=1){
endBrother = endBrother.nextSibling;
}
return endBrother;
}
endBrother=startBrother.nextSibling;
while(endBrother.nodeType!=1){
endBrother = endBrother.nextSibling;
}
return endBrother;
}
The full article can be found on the Agave Group Design website.
Hey this is just what I was looking for. Thanks
Thanks buddy…
I tried the code but to make it run I had to put 1 as String
function getNextSibling(startBrother){
endBrother=startBrother.nextSibling;
while(endBrother.nodeType!=”1″){
endBrother = endBrother.nextSibling;
}
return endBrother;
}
My Firefox version is 2.0.0.9
the problem with this code starts when the
startBrother.nextSibling = empty space, which in ie you can check it with “if(startBrother.nextSibling)” but with firefox there’s a bit of complex.. didn’t find the answer yet…
Just exploring some Javascript stuff. LOL, I accidently copied the code in comments, so it works. Same code works for previousSibling, only u have to chande the nextSibling to previousSibling. Great work!
Thanks.
so cool.. I like it. thanks.
I didn’t like that if the element doesn’t have a sibling, then the code errors out :/
I changed the code to check this (and also changed it so it gets the next node of the same type)
function getNextSibling(startBrother) {
endBrother = startBrother.nextSibling;
while (endBrother && endBrother.nodeName != startBrother.nodeName) {
endBrother = endBrother.nextSibling;
}
if (!endBrother) {
return false;
}
return endBrother;
}
use it like this:
if (getNextSibling(el)) {
[//CODE//]
}
I’m experiencing extra spaces in firefox 3.5.5 when using the jquery hide function to hide divs when they are empty. I’m pretty sure this is what i need but i have no idea how to implement it with the jquery hide function and am hoping someone might be able to help. Below is my jquery code:
$(document).ready(function () {
$(‘.show’).each(function() {
if ($(this).text() == “”) {
$(this).hide();
};
});
});
////The html is:
////end html
I did eliminate all spaces between divs and it did eliminate the spaces in output but it makes the code not human-readable friendly which i would like.
Thanks for any help!
oops – i guess i can’t place the html? – basically it’s
a number of divs with the class “show” in a table.
Works like a charm ! thanks!