This is a post which has torture the community very much.
I have AJAX loaded XHTML with scripts:
- External, as <script src="..." />
- Internal, as <script>alert(1);</script>
- As action on events: <a href="" onclick="alert(5); return false;">whow!</a>
IE is not W3C compliant browser so I don't care to support it.
Opera works without any additional work. Scripts running when AJAX loading completes. :)
Firefox works:
- On external with code below (create a <script> element and append on <head> element) :eek:
- On internal with code below (eval) :eek:
- As action on events, without any additional work. :)
Webkit (Safari/Chrome) works:
- On external with code below (create a <script> element and append on <head> element) :eek:
- On internal with code below (eval) :eek:
- As action on events, doesn't work at all :(
So, these questions:
- What I can do to eval() element's event's script on Webkit (Safari/Chrome)? (like <a href="" onclick="alert(5); return false;">whow!</a>)
- Is there a schedule for Firefox and Webkit to automatically load and eval dynamically loaded scripts with AJAX, exactly like Opera?
the code: (innerDOM is the function)
Code:
// create element 'tag'
// add attributes from 'attr' array: [ [ 'attribute1', 'value1' ], [ 'attribute2', 'value2' ] ]
// add contents from 'content' array: [ 'a string', ELEMENT, 5 ]
// append it to 'owner' element
function createTag(tag, content, owner, attr) {
var t = document.createElement(tag);
if (attr instanceof Array)
for (var z = 0; z < attr.length; z++)
t.setAttribute(attr[z][0], attr[z][1]);
if (content instanceof Array)
for(var z = 0; z != content.length; z++)
if (typeof(content[z]) == 'string' || typeof(content[z]) == 'number')
t.appendChild(document.createTextNode(content[z]));
else t.appendChild(content[z]);
if (owner) owner.appendChild(t);
return t;
}
// insert 'root' xml tree to 'where' element
function innerDOM(where, root) {
for (var z = 0; z < root.childNodes.length; z++)
where.appendChild(root.childNodes[z].cloneNode(true));
var scripts = where.getElementsByTagName("script");
for (v in scripts) {
if (scripts[v].getAttribute('src'))
createTag('script', null, document.getElementsByTagName("head")[0], [['type', 'text/javascript'], ['src', scripts[v].getAttribute('src')]]);
else eval(scripts[v].text);
}
}
dynamically loaded scripts
