Forum Moderators: open
<div id="test">
<p>This is a sample paragraph.</p>
</div>
<script>
alert(document.getElementById("test").childNodes.length);
</script>
gives "1" in IE (which is what you would expect)
but gives "3" in Firefox?
So why wont this work:
<style>
#n1 p
{
display:none;
}
</style>
<div id="n1"><p>AAAAAA</p><p>BBBBBB</p><p>CCCCCC</p><p>DDDDDD</p><p>EEEEEE</p></div>
<script>
document.getElementById("n1").childNodes[1].childNodes[0].setAttribute("display:block");
</script>
should make BBBBBB display on page
document.getElementById("n1").childNodes[1].childNodes[0].style.display="block";
But it should. Why can't firefox just support "document.getElementById(id).children" - that would make my life easier.
.childNodes[0]n1
<html>
<head>
<script type="text/javascript">
function run(count)
{
var list = document.getElementById("ticker").childNodes;
if(list[count-1])
{
list[count-1].style.display = "none";
list[count-1].setAttribute("display:none");
}
else
{
list[list.length-1].style.display = "none";
list[list.length-1].setAttribute("display:none");
}
list[count].style.display = "block";
list[count].setAttribute("display:block");
count++;
if(count == list.length)
count = 0;
window.setTimeout("run(" + count+ ")",5000);
}
</script>
</head>
<body>
<div id="ticker"><h3>This is an H3 element</h3><p>Test 1 - this is my first sentance, isn't it a great sentance, it can be as long as you want it to be har har</p><p>Test 2 - this is my second sentance</p><p>Test 3 - this is my third sentance</p></div>
<script type='text/javascript'>
run(0);
</script>
</body>
</html>
list[count-1]
if(list[count-1])
the condition checks if the array element exists. If it doesn't exist (quite right, when count is 0), it will simply return false.
So that can't be the problem firefox has. It's just bad implementation of the DOM - there are loads of articles on its bad implementation - but noone seems to have found a fix.
<html>
<head>
<script type="text/javascript">
function run(count)
{
var list = document.getElementById("ticker").childNodes;
if(count > 0)
{
list[count-1].style.display = "none";
}
else
{
list[list.length-1].style.display = "none";
}
list[count].style.display = "block";
count++;
if(count == list.length)
count = 0;
window.setTimeout("run(" + count+ ")",1000);
}
</script>
<style type="text/css">
#ticker h3, #ticker p
{
display:none;
}
</style>
</head>
<body>
<div id="ticker"><h3>This is an H3 element, it should still work!</h3><p>Test 1 - this is my first sentance, isn't it a great sentance, it can be as long as you want it to be har har</p><p>Test 2 - this is my second sentance</p><p>Test 3 - this is my third sentance</p></div>
<script type='text/javascript'>
run(0);
</script>
</body>
</html>
It seems checking if an array element exists (that doesn't exist) causes firefox to die.
Oh well, you learn something every day i guess.
that can't be the problem because i do:if(list[count-1])
the condition checks if the array element exists
That so? :) That statement is causing your script to break in FF. Have you used the FF Javascript console? You can see the error there.
If you replace that test with something less dangerous, like
if(count>0)
I also wrote this "pre-render" function which strips whitespace elements from the DOM tree that firefox produces:
function initialiseList(divId)
{
list = document.getElementById(divId).childNodes;
for (var i=0; i<list.length; i++)
{
var node = list[i];
if (node.nodeType == 3 &&!/\S/.test(node.nodeValue))
document.getElementById(divId).removeChild(node);}
run(divId, 0);
}
