Which method is better?
I'm creating a script like this:
As you can see, there are <span>'s with the same onmouseover and onmouseout event, and these will be a lot, is there any way to make the code neater?
this is <span onmouseover="callafunction()" onmouseout="callafunction()"><span onmouseover="callafunction()" onmouseout="callafunction()">inner text</span> inside another span</span> and this is outer text.
I'm thinking to use DHTML to add the events on runtime, so in my code it will be like this:
then I'll scan and add the onmouse* events to the <span>'s, is it possible? which one is lighter for browser? I assume if it's lighter then it will be faster too, both on loading and processing time.
this is <span><span>inner text</span> inside another span</span> and this is outer text.
Your opinion please, thanks in advance. :)
I would add them dynamically with an onload function.
It's slower though, but almost unnoticable.
You could attach event handlers using the DOM. To access all your spans you could wrap them into a div with an id and then do like this:
var div = document.getElementById("div_with_spans");
for (var i = 0; i < div.childNodes.length; i++)
div.childNodes[i].onmouseover = callafunction;
div.childNodes[i].onmouseout = callafunction;
Okay, seems like everyone suggested me to create it dynamically. Thanks for all your replies! :)