javascript 如何检查是否已包含 JS 文件？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18155347/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I check if a JS file has been included already?
提问by confile
I have split my javascript in different files. I want to prevent, that javascript files are loaded twice. How can I do that?
我已将我的 javascript 拆分为不同的文件。我想防止 javascript 文件被加载两次。我怎样才能做到这一点？
回答by cwallenpoole
Here's a test to see if a script has been included based on the path to the js file:
下面是根据js文件的路径来测试是否包含了脚本：
function isScriptAlreadyIncluded(src){
var scripts = document.getElementsByTagName("script");
for(var i = 0; i < scripts.length; i++)
if(scripts[i].getAttribute('src') == src) return true;
return false;
}
It will work for all scripts not loaded through AJAX, though you may want to modify it if you have jsonp code running.
它适用于所有未通过 AJAX 加载的脚本，但如果您运行 jsonp 代码，您可能需要修改它。
回答by Renan
Don't include them twice. It's you who's doing the includes, after all.
不要包括它们两次。毕竟，是你在做包含。
If you're doing those inclusions dynamically, though, you may check whether some global function or object has been set by the script. For example, if I have the script below in a file:
但是，如果您动态地进行这些包含，则可以检查脚本是否已设置某些全局函数或对象。例如，如果我在文件中有以下脚本：
Foo = function () {};
And then I include it like this:
然后我像这样包含它：
<script src="../foo.js"></script>
Before that script tag is parsed by the browser, Foois undefined. After the tag is processed, Foois a Function. You could use some logic based on that to determine whether you should include some file or not.
在浏览器解析该脚本标记之前，Foo是undefined. 标签处理后，Foo是一个Function. 您可以使用一些基于此的逻辑来确定是否应该包含某个文件。
回答by Renan
I have tackled this using a generic self-invoking function added at the bottom of each dynamically loaded script.
我已经使用在每个动态加载的脚本底部添加的通用自调用函数解决了这个问题。
First - by declaring a new empty array in my base file or a script that will always be loaded, ie the main page in my case index.php
首先 - 通过在我的基本文件或将始终加载的脚本中声明一个新的空数组，即我案例中的主页 index.php
var scriptsLoaded = new Array();
Then add a self executing function to the end of the loaded script:
然后在加载的脚本末尾添加一个自执行函数：
(function () { scriptsLoaded.push( 'this_script_name.js' ) })();
With this approach any filename in the scriptsLoaded array should only refer to scripts that have been fully loaded already. Simply checking this array would indicate whether a script has been loaded which can also be used as a check for whether to execute on-load style functions for whatever the script is needed for
使用这种方法，scriptsLoaded 数组中的任何文件名都应该只引用已经完全加载的脚本。简单地检查此数组将指示是否已加载脚本，这也可以用作检查是否为需要的任何脚本执行加载样式函数
回答by UweB
Not using any framework (that I know of), you can only do so by checking if a certain variable in the global scope has already been declared.
不使用任何框架（我知道），您只能通过检查是否已经声明了全局范围中的某个变量来做到这一点。
You could declare a variable var include1 = true;inside include1.js, and do something like
你可以var include1 = true;在里面声明一个变量include1.js，然后做类似的事情
if (window.include1 !== true) {
// load file dynamically
}
回答by Mims H. Wright
You would need to manually track this and make sure. UweB's suggestion would also work.
您需要手动跟踪并确保。UweB 的建议也适用。
You could also check out Require.js which could help you to organize your files.
您还可以查看 Require.js，它可以帮助您组织文件。
