ansaurus

Question

How to execute a page ,that contains JS ,in AJAX ,using innerHTML?

Answer 1

A:

It looks like the only purpose of setting innerHTML is an attempt to get the JS to execute. But once the page is loaded, JS won't 'know' that it needs to parse and execute the new text you've changed, so your method won't work. In this case, what you want is a callback function:

http://api.jquery.com/jQuery.ajax/

I haven't used jQuery, but it looks like you'd simply add a 'complete' property to the settings object you pass to the .ajax() call, like so:

 $.ajax({
   // ......

   complete: function(){
     alert('Something');
   }

   // ......
 });

In this case, the callback function would execute once the ajax call has completed. You can pick other events, such as on success, on failure, and so on, if you need to attach your code to a different event.

Ryan Mitchell 2010-03-07 08:59:35

I don't want to use jQuery.I already tryed with ii.

A.Angelov 2010-03-07 09:02:20

Ah, I posted before you'd edited, I assumed you were using the jQuery ajax library. In any case, I think I misunderstood the issue a bit, the problem is that you don't know what JS code you need to execute until the server generates it for you? If there are a limited number of responses you could receive from the server, you could have the server return a short string and then switch on that in your handler - if you need to execute any arbitrary JS I guess you could call eval() on it, but I'd be VERY careful with that.

Ryan Mitchell 2010-03-07 09:04:18

It won't be a commercial site.But how to find the script tags and eval them?

A.Angelov 2010-03-07 09:07:27

Answer 2

+1 A:

Instead of trying to inject a script element in the DOM, just have your script return:

alert('Something');

And then use eval(response); to run it. Or you could add a script element with the src attribute pointing to the page that returns your JavaScript into the <head> (which is the preferred method).

function loadScript(url) {
    var head = document.getElementsByTagName("head")[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    head.appendChild(script);
}

Keep in mind that this wont work for cross-domain requests--the script has to have the same origin as the page running your code. To get around this, you'll have to use a callback.

Tyson 2010-03-07 09:06:10

It isn't only JS.It's mixed html and js

A.Angelov 2010-03-07 09:09:46

I suppose to use replace,but how?

A.Angelov 2010-03-07 09:15:35

Answer 3

A:

But how to find the script tags?

Well, parent.getElementsByTagName('script') and then evaling the data of the text node inside will do it.

However, inserting content that includes script tags is unreliable and works slightly differently across browsers. eg. IE will execute the script the first time the script node is inserted into any parent, inside the document or not, whilst Firefox will execute script the first time a subtree including the script is added to a node inside the document. So if you're not extremely careful, you can end up executing scripts twice on some browsers, or executing the script at the wrong time, following a further page manipulation.

So don't. Return script that you want to execute separately to any HTML content, eg. using a JSON object containing both the HTML and the JavaScript seperately.

bobince 2010-03-07 09:22:19

After ajaxRequest.send(null); I putvar justexit = document.getElementsByTagName('script');eval(justexit);but it isn't working again?

A.Angelov 2010-03-07 09:32:04

`getElementsByTagName` returns a `NodeList`. You would have to iterate the list and `eval` the `data` of the `Text` node inside each `script` element. Again, don't do this.

bobince 2010-03-07 10:39:29

ansaurus

tags:

views:

answers:

How to execute a page ,that contains JS ,in AJAX ,using innerHTML?

related questions