Javascript AJAX include file witth eval - Stack Overflow

admin管理员组

文章数量:1220960

Suppose I have

1) a HTML document.

2) This HTML document loads Javascript file "code.js" like this:

<script src="code.js">

3) User clicks button which runs "fetchdata" function in "code.js",

4) "fetchdata" function looks like this:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState==4) {
        myjsdata = xmlhttp.responseText;
    }
}
xmlhttp.open("GET", '.js', false);
xmlhttp.send(null);

...

Now how do I do the following successfully:

I want to insert/eval my Javascript in a way, so all functions in "code.js" including "fetchdata" and functions defined above/below can access the data (structures, declarations, pre-calculated data values etc.) in "data.js".

(If this was possible, it would be idea since I could wait loading the actual JS data file until the user explicitly requests it.)

Suppose I have

1) a HTML document.

2) This HTML document loads Javascript file "code.js" like this:

<script src="code.js">

3) User clicks button which runs "fetchdata" function in "code.js",

4) "fetchdata" function looks like this:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState==4) {
        myjsdata = xmlhttp.responseText;
    }
}
xmlhttp.open("GET", 'http://www.example.com/data.js', false);
xmlhttp.send(null);

...

Now how do I do the following successfully:

I want to insert/eval my Javascript in a way, so all functions in "code.js" including "fetchdata" and functions defined above/below can access the data (structures, declarations, pre-calculated data values etc.) in "data.js".

(If this was possible, it would be idea since I could wait loading the actual JS data file until the user explicitly requests it.)

• javascript
• ajax
• include
• scope
• eval

Share Improve this question Follow edited Jan 26, 2012 at 3:14 Tom asked Jan 26, 2012 at 3:08 TomTom 3,6271010 gold badges7272 silver badges136136 bronze badges 1

• Do you use jQuery, or have any specific reason not too? It can drastically help with things like ajax calls, so you don't have to check readystate and status, which you should have been checking for 200 on success. – mowwwalker Commented Jan 26, 2012 at 3:15

Add a comment  | 

3 Answers 3

Sorted by: Reset to default 10

jQuery always has something for everything:

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

Loads a javascript file from url and executes it in the global context.

edit: Oops, didn't see that you weren't using jQuery. Everyone is always using jQuery...

Just do:

var scrpt = document.createElement('script');
scrpt.src='http://www.example.com/data.js';
document.head.appendChild(scrpt);

i think you should take a look at this site

this site talks about dynamic loading and callbacks (with examples) - where you can call a function in the loaded script after it loads. no jQUery, just pure JS.

This depends on a lot of factors, but in most cases, you will want to load all of your code/html/css in one sitting. It takes fewer requests, and thus boast a higher perceived performance benefit. Unless your code file is over several Megabytes big, loading it when a user requests it is unnecessary.

In addition to all of this, modifying innerHTML and running scripts via eval can be very cumbersome and risky (respectively). Many online references will back this point. Don't assume that, just because a library is doing something like this, it is safe to perform.

That said, it is entirely possible to load external js files and execute them. One way is to stick all of the code into a newly created script tag. You can also just try running the code in an eval function call (though it isn't recommended).

address = "testscript.js";

var req = (window.XMLHttpRequest)?new XMLHttpRequest():new ActiveXObject("Microsoft.XMLHTTP");
if(req == null) {
    console.log("Error: XMLHttpRequest failed to initiate.");
}
req.onload = function() {
    try {
        eval(req.responseText);
    } catch(e) {
        console.log("There was an error in the script file.");
    }
}
try {

    req.open("GET", address, true);
    req.send(null);

} catch(e) {
    console.log("Error retrieving data httpReq. Some browsers only accept cross-domain request with HTTP.");
}

本文标签： Javascript AJAX include file witth evalStack Overflow