Javascript Inline Events or Adding Events Afterwards

Question

Hello,

I have a question, which I can't seem to decide on my own so I'll ask here. The question is simple: whether use inline Javascript events or adding them afterward. The theory in the background isn't that simple though:

I have a JS object that returns HTML. Whenever you create this object, the returned HTML will be used for another object's HTML. Therefore, adding events is not straight-forward. See:

secret.object = function()
{
 this.init = function()
 {
  var html = '<div>and lots of other HTML content</div>';
  return html;
 };
}

This is a sample object that is created within this code:

    for ( var i = 0; i < countObjects; i++)
     {
  var obj = arguments[0].content[i];


   generatedContent += spawnSecret(); /* The spawnSecret() is a method that initializes the object, and calls its init() method that returns the HTML.

 }

and then later on I create a new object whose property "content" will be set to "generatedContent". It need to add the events within the secret object I have, nowhere else. And since my system is built like this, I see only two ways around this: use inline events or build HTML using method calling instead of returning.

Hopefully this wasn't too hard to understand..

Answer 1

I cant see it making much of a difference- if you just render your events using "onclick" etc. javascript event handlers they will be evaluated as soon as you append your generated html to the document, rather than you having to call attachEvent() or whatever,.

Answer 2

If you created the elements using document.createElement() (but didn't append them to the DOM) and kept a reference to them, then you could populate them with the text content and attach event handlers to them, without having to use inline events.

When you are ready to reveal your 'secret' you could then append them to the DOM, rather than dumping in a text string of HTML tags and content.