7

我需要从另一个“.js”文件调用外部“.js”文件中的函数，而不引用标记中的外部文件<head>。

我知道可以将外部“.js”文件动态添加到允许访问该文件的文件中，我可以这样做......

var AppFile = "test/testApp_1.js"; 
var NewScript=document.createElement('script');
var headID = document.getElementsByTagName("head")[0]; 
NewScript.src = AppFile;
headID.appendChild(NewScript);

然而...

这对我来说没用，因为外部文件需要是在...上运行启动程序的独立文件

$(document).ready(function()
{...}

因此动态添加完整文件会产生不良影响。此外，我不能在<head>标签中预先引用外部文件，因为它需要是动态的。所以，这个外部文件"test/testApp_1.js"包含一个返回字符串变量的函数......

function setAppLogo(){

 var LogoFile = "test/TestApp_1_Logo.png";

 return LogoFile;
}

我需要访问这个函数，或者我可以将字符串作为全局变量存储在外部文件中......任何一种方式都很好，我只需要访问值LogoFile而不加载整个外部文件。

这个已经让我难倒了几个小时，所以任何想法都将不胜感激。

4

6 回答 6

1

您可能会受益于拥有某种app.js包含全局变量/值的文件，您希望在很多地方使用这些文件。您应该.js在每个页面上都包含此文件（如果您想变得聪明并提高性能，可以将其缩小/与其他 js 连接）。通常，这些全局变量应该附加到您创建的某些对象var APPNAME = { }; 上，例如上面将在许多地方使用的变量/函数。

一旦你有了这个，你想要加载的外部“.js”文件，以及你当前所在的文件，都可以访问全局 APPNAME 变量及其所有属性/函数，并根据需要使用它们。这可能是使您的 javascript 更加模块化和可分离的更好方法。希望这可以帮助。

于 2012-07-25T20:47:54.667 回答
0

好的，感谢大家的所有输入，但我认为我正在尝试做的事情目前是不可能的，即在不加载该文件的情况下从另一个文件访问一个函数。但是，我找到了解决问题的方法。我现在查询我的服务器以获取可用应用程序的列表，然后我使用此列表在 UI 中动态构建应用程序。然后选择一个应用程序时，我可以调用该文件和其中的函数。它有点复杂，但它是动态的，具有良好的性能，并且可以正常工作。再次感谢您的头脑风暴！;)

于 2012-07-26T07:38:32.343 回答
0

可以通过 XHR 加载整个脚本（例如jQuery 中的 $.get），然后解析它，也许使用正则表达式，以提取所需的部分：

$.get('pathtoscript.js', function(scriptBody) {
    var regex = /function\s+setUpLogo\(\)\s*\{[^}]+}/g;
    alert(scriptBody.match(regex)[0]); // supposed to output a function called
                                       // 'setUpLogo' from the script, if the 
                                       // function does not have {} blocks inside
});

然而，需要注意的是，这种方法极有可能引发维护障碍。正则表达式不是解析 JavaScript 代码的最佳工具；例如，上面的示例不会解析带有嵌套 {} 块的函数，这些块很可能存在于相关代码中。

可能建议找到问题的服务器端解决方案，例如在页面发送到浏览器之前添加必要的脚本路径或其部分。

于 2012-07-04T06:01:23.650 回答
0

您想在使用 ajax 加载 jQuery 后加载文件，然后在成功的 ajax 函数中运行相关脚本。

参见 jQuery 的 getScript 函数：http ://api.jquery.com/jQuery.getScript/

$(document).ready(function(){
 $.getScript("http://domain.com/ajax/test.js", function(data, textStatus, jqxhr) {
    console.log(data); //data returned
    console.log(textStatus); //success
    console.log(jqxhr.status); //200
    console.log('Load was performed.');
    //run your second script executable code here
 });
});
于 2012-07-03T14:07:21.040 回答
0

我不确定这是一个好主意，但您可以创建一个 iframe 并在其“窗口”对象内评估文件，以避免大多数不良副作用（假设它不尝试访问其父级）。然后你可以通过 iframe 的 window 对象访问你想要的任何函数/变量。

例子：

function loadSomeJsInAFrame(url,cb) {
        jQuery.get(url,function(res) {
            iframe = jQuery('<iframe></iframe>').hide().appendTo(document.body);
            iframe[0].contentWindow.eval(res);
        if(cb) cb(iframe[0].contentWindow);
    },'text');
}

loadSomeJsInAFrame('test/testApp_1.js',function(frameWindow) {
    console.log(frameWindow.setAppLogo());
    jQuery(frameWindow.frameElement).remove();
});

这不能保证文件中的 sript 不会弄乱您的文档，但如果它来自受信任的来源，则不太可能。

此外，在您获得所需内容后，不要忘记删除您的 iframe。

于 2012-07-20T21:20:54.870 回答
0

在Web Workers的帮助下，这可能是可能的。您将能够在一个孤立的环境中运行您想要注入的脚本，因此它不会弄乱您的当前页面。

正如你所说，它可能setAppLogo是全局的"test/testApp_1.js"，所以我将依赖这个声明。

在您的原始脚本中，您应该创建一个工作人员，它引用工作人员脚本文件 + 收听来自工作人员的消息：

var worker = new Worker('worker.js');
worker.onmessage = function (e) {
    // ....
};

然后，在 worker ( worker.js) 中，您可以使用允许在 worker 中加载外部脚本的特殊函数importScripts( docs )，worker 还可以看到这些脚本的全局变量。worker 中还有一个功能postMessage可以将自定义消息发送回原始脚本，而原始脚本又会监听这些消息（worker.onmessage）。代码worker.js：

importScripts('test/testApp_1.js');

// "setAppLogo" is now available to worker as it is global in 'test/testApp_1.js'

// use Worker API to send message back to original script
postMessage(setAppLogo());

当它调用时，您将setAppLogo在侦听器中获得结果：

worker.onmessage = function (e) {
    console.log(e.data); // "test/TestApp_1_Logo.png"
};

这个例子是非常基础的，你应该阅读更多关于 Web Workers API 和可能的陷阱。

于 2015-06-08T13:14:05.267 回答