2010-02-12 124 views
44

我正在尝试执行类似于C #include "filename.c"或PHP include(dirname(__FILE__)."filename.php")但JavaScript的操作。我知道我可以做到这一点,如果我可以得到加载js文件的URL(例如,在标签的src属性中给出的URL)。有没有什么办法让JavaScript知道?如何获取当前正在执行的javascript代码的文件路径

或者,有没有什么好的方法来从同一个域动态加载JavaScript(不知道该域具体)?例如,假设我们有两台相同的服务器(质量保证和生产),但它们显然有不同的URL域。有没有办法做到像include("myLib.js");这样的地方,myLib.js会从加载它的文件的域中加载?

对不起,如果这有点令人困惑。

回答

67

的脚本中的脚本:

var scripts = document.getElementsByTagName("script"), 
    src = scripts[scripts.length-1].src; 

这工作,因为浏览器会按顺序加载和执行脚本,所以当您的脚本执行时,它所包含的文档肯定会将脚本元素作为页面上的最后一个脚本元素。这段代码当然必须是脚本的'全局',所以将'src'保存在稍后可以使用的地方。避免在包装它泄漏全局变量:

(function() { ... })(); 
+4

这是一个很好的建议,只要脚本中的代码以“内联”的方式运行(即按照您的建议在全局环境或“立即运行匿名方法”中运行,而不是在“稍后调用”功能或设置超时)。您可以通过这种方式在当前文件/路径的每个javascript中创建一个var。但是,请注意,“泄漏的全局变量”无法通过我所谓的immediate-run-anon-methods来解决,'(function(){...})();' - 上面的示例仍然会创建一个全局变量叫做'src',因为它之前没有'var'说明符 – Graza 2010-02-12 23:14:46

+0

这非常棒。一个问题是,如果我使用jQuery的getScript方法,它会失败(返回空白)。任何解决方案? – 2010-02-12 23:24:51

+4

'src'有一个var说明符(请参阅第一行末尾的逗号) – InfinitiesLoop 2010-02-12 23:30:34

1

我可能会误解你的问题,但似乎只要生产和开发服务器使用相同的路径结构就可以使用相对路径。

 
<script language="javascript" src="js/myLib.js" /> 
+2

问题是,这个JavaScript库是要加载到不同的域。 – 2010-02-12 23:12:06

+0

那么这是一个单一的js库文件位于一个域需要被拉入多个域?或者,这是一个js文件,驻留在多个域中,需要将其他js文件相对于其源文件拉入其中?你能提供一个你想要完成的例子吗? – johnmdonahue 2010-02-12 23:17:17

+0

其实两者。 js文件将驻留在多个域(QA vs生产)中,并且它也将包含在多个域中(无论Web应用程序需要使用该库)。 – 2010-02-12 23:26:55

0

不管它的脚本,HTML文件(一帧,例如),CSS文件,图像,不管,如果你指定服务器/域的HTML文档的路径是默认的,所以你可以做,例如,

<script type=text/javascript src='/dir/jsfile.js'></script>

<script type=text/javascript src='../../scripts/jsfile.js'></script>

如果不提供服务器/域,路径将是相对于页面的路径或主文档的路径

24

除了IE(任何版本),所有浏览器都有document.currentScript,它总是始终工作(无论该文件是如何被列入(异步,书签等))。

如果你想知道你现在是JS文件的完整URL:

var script = document.currentScript; 
var fullUrl = script.src; 

Tadaa。

+0

这真棒,正是我希望找到的! – Markus 2016-01-12 16:38:10

+0

谢谢,我终于找到解决方案! – Alcalyn 2016-04-07 17:41:17

3

我最近发现了一个更简洁的方法,可以在任何时候执行,而不是在脚本加载时被迫同步执行。

使用stackinfo在当前位置获取堆栈跟踪,并从堆栈顶部获取名称info.file

info = stackinfo() 
console.log('This is the url of the script '+info[0].file) 
14

如果您的文档中包含内联脚本,则此处接受的答案不起作用。为了避免这种情况,您可以使用以下内容仅针对具有[src]属性的<script>标签。

/** 
* Current Script Path 
* 
* Get the dir path to the currently executing script file 
* which is always the last one in the scripts array with 
* an [src] attr 
*/ 
var currentScriptPath = function() { 

    var scripts = document.querySelectorAll('script[src]'); 
    var currentScript = scripts[ scripts.length - 1 ].src; 
    var currentScriptChunks = currentScript.split('/'); 
    var currentScriptFile = currentScriptChunks[ currentScriptChunks.length - 1 ]; 

    return currentScript.replace(currentScriptFile, ''); 
} 

这有效捕捉了最后一个外部.js文件,解决了我在内联JS模板中遇到的一些问题。

+0

很棒!谢谢!!!。我发现并尝试了很多解决方案,但没有获得积极的结果。 – MarianoVolker 2016-02-18 04:16:41

2

我编写了一个简单的函数,它允许通过使用try/catch方法来获取当前JavaScript文件的绝对位置。您可以看到它here

+0

为什么要投票?考虑添加评论以及..反正。 – 2015-07-09 13:26:13

+3

因为根据规则,你应该在你的答案中解释解决方案,而不仅仅是链接。如果该链接消失,那么你的答案是毫无意义的。 – 2015-08-14 08:07:44

+0

这太棒了,谢谢分享。另外,你可以检查一下'document.currentScript',以防它被_is_定义。 – alecov 2016-06-02 21:57:15

3

精炼后在这里找到答案,我想出了以下内容:

getCurrentScript.js

var getCurrentScript = function() { 
    if (document.currentScript) { 
    return document.currentScript.src; 
    } else { 
    var scripts = document.getElementsByTagName('script'); 
    return scripts[scripts.length-1].src; 

    } 
}; 

module.exports = getCurrentScript; 

getCurrentScriptPath.js

var getCurrentScript = require('./getCurrentScript'); 

var getCurrentScriptPath = function() { 
    var script = getCurrentScript(); 
    var path = script.substring(0, script.lastIndexOf('/')); 
    return path; 
}; 

module.exports = getCurrentScriptPath; 

BTW:我使用CommonJS 模块格式和外壳与webpack

3

我刚才提出这个小窍门:在

window.getRunningScript =() => { 
    return() => { 
     let err = new Error() 
     let link = err.stack.split('(') 
     link = link[1] 
     link = link.split(')')[0] 
     link = link.split(':') 
     link.splice(-2, 2) 
     link = link.join(':') 

     return link 
    } 
} 

console.log('%c Currently running script:', 'color: blue', getRunningScript()()) 

screenshot

工作:Chrome浏览器,火狐,边缘

享受!

相关问题