html - Can I add javascript dynamically to an existing script element

Question

I want to dynamically add javascript to an existing script element something like:

var se = document.createElement('script');
se.setAttribute('type', 'text/javascript');
se.innerHTML = 'alert(1)';
document.getElementsByTagName('head').item(0).appendChild(se);

The interesting part is se.innerHTML = 'alert(1)'; and if it is valid? If not how can I do this the right way?

Answer 1

All browsers currently support a javascript text property, and will evaluate the text when a new script element (without a src attribute) is added to the document.

innerHTML or adding child nodes to a script element do not evaluate the script in all browsers.

function addCode(code){
    var JS= document.createElement('script');
    JS.text= code;
    document.body.appendChild(JS);
}

//test case

var s= 'document.body.ondblclick=function(e){
'+
'e=window.event? event.srcElement:e.target;
'+
'alert(e.id || e.tagName);
'+
'}
alert("ready to double click!");';

addCode(s);