PDA

View Full Version : Strange code execution order



Twey
07-03-2005, 02:20 PM
Can someone please explain why the bit in red:
function menu(parent, menuarr, layer) {
parent.style.backgroundColor = "silver";
theMenu = document.getElementById("menu");
if(theMenu.innerHTML.indexOf('<p id="menulayer' + layer + '">') == -1) {
theMenu.innerHTML += "<p id=\"menulayer" + layer + "\">";
} else {
theMenu = document.getElementById("menulayer" + layer);
}
for(i = 0; i < menuarr.length; i++) {
if(menuarr[i].indexOf('::') != -1) {
title = menuarr[i].substring(0, menuarr[i].indexOf('::'));
url = menuarr[i].substring(menuarr[i].indexOf('::') + 2, menuarr[i].length);
} else {
title = menuarr[i].substring(0, menuarr[i].indexOf(';;'));
url = menuarr[i].substring(menuarr[i].indexOf(';;') + 2, menuarr[i].length);
url = "javascript:void(0);\" onclick=\"menu(this, " + url + ", " + (layer + 1) + ");";
}
theMenu.innerHTML += "<a href=\"" + url + "\">" + title + "</a>";
if(!(i == menuarr.length - 1)) theMenu.innerHTML += "&nbsp;&bull;&nbsp;";
}
theMenu.innerHTML += "</p>";
theMenu.style.display = "inherit";
}... is being executed before the bit in green?
It's been bugging me for ages; probably just needs a different viewpoint.

Thanks in advance,

mwinter
07-03-2005, 06:51 PM
No doubt you're expecting this answer: it can't be. The loop, its block statement, and all side effects must be completely evaluated before the assignment statements after it are executed. This only way this could be different is if the global setTimeout function is used, or you're dealing with a very broken interpreter.

Without a bare-minimum demonstration though, it's very difficult to explain why you're seeing what you're seeing.

Mike

Twey
07-03-2005, 07:53 PM
The output was appearing as "<p></p>menu" instead of "<p>menu</p>".
I think it's because the innerHTML was temporarily invalid, so the browser (Firefox) quickly stuck a </p> in to make it valid. I solved it by putting everything into a variable, then transferring it to innerHTML all at once.

jscheuer1
07-03-2005, 08:03 PM
I too have run into situations where innerHTML had to be written at once rather than using the += method. Not sure of why this happens sometimes and not others.

jscheuer1
07-03-2005, 08:21 PM
I just did some tests and IE6 will throw an unknown error if you try that with a paragraph. IE will accept a span though but, closes it twice - once after it is written without a closing tag and again when you add the closing tag. FF will close it just as you describe and then ignore the following command to close the paragraph or span as extraneous.

Twey
07-04-2005, 05:24 PM
Well, that's that off my mind :p Thanks to all for the effort.
Now for the next problem: does anyone know why this page (crystalinity.net/bjjs) throws a "Could not get display property. Invalid argument." error on accessing the menu in IE? Nothing else seems to mind (Firefox, Mozilla, Opera, Epiphany, Konqueror).

P.S. Yes I know it's awful, it's only a rough draft :p

jscheuer1
07-04-2005, 07:46 PM
Yeah, IE's script error reporting leaves much to be desired. I notice you have alot of '!=' where '!==' would be more correct. I'd try replacing those first to see what happens. The only other suggestion I would have is that since there are only 4 written calls to access the display property in the script, try commenting them out one at a time to (hopefully) see where IE chokes.

Twey
07-04-2005, 08:02 PM
I've never heard of !==.
What is the difference from !=? (opposite of ===?)

mwinter
07-04-2005, 08:09 PM
I've never heard of !==.
What is the difference from !=? (opposite of ===?)Yes, !== and === are opposites (as are != and == of course).

You probably know the general difference of the two forms from PHP (== type converts, whilst === doesn't).

Mike

Twey
07-05-2005, 08:52 AM
You learn something every day. I always used !(a === b) when that was necessary, and avoided it otherwise.

EDIT:
Found problematical line:
45: document.getElementById("menu").style.display = "inherit";... but can't see what's wrong with it. Have changed offending <div> to a <span>, but still no joy.

techno_race
03-02-2007, 02:37 AM
I'm not positive, but try

document.getElementById("menu").style\.display = "inherit"

Twey
03-02-2007, 02:51 PM
Unlikely, although I no longer have the page available to try it.

Why on Earth did you resurrect this ancient thread? :)