JS获取当前脚本文件的绝对路径

当写模块加载器时，获取当前脚本文件的绝对路径作为基础路径是必不可少的一步，下面我们一起来探讨一下这个问题吧！ 一、各大浏览器的实现方式　　　　　　　　　　　　　　　　  [a]. Chrome和FF  超简单的一句足矣！ var getCurrAbsPath = function(){ return document.currentScript.src; }; 这里利用了对象 document.currentScript ，它返回的是当前执行的script元素；然后调用script元素的src属性即可获取脚本文件的绝对路径。   [b]. IE10+、Safari和Opera9  利用E 在JavaScript编程中，有时我们需要获取当前执行脚本文件的绝对路径，这在开发模块加载器或者需要基于脚本位置进行资源加载的情况下尤为重要。本文将详细解释如何在不同浏览器环境下实现这一功能，并介绍相关的JavaScript知识。 我们来看一下在Chrome和Firefox这两种现代浏览器中的实现方法。这两种浏览器支持`document.currentScript`属性，它会返回当前正在执行的`<script>`元素。因此，获取脚本文件的绝对路径只需要一行代码： ```javascript var getCurrAbsPath = function() { return document.currentScript.src; }; ``` 对于IE10及以上版本、Safari和Opera9，它们提供了不同的机制来获取脚本文件的绝对路径。在这些浏览器中，我们可以利用错误处理堆栈信息。例如，IE10+提供了`e.stack`，Safari提供了`e.sourceURL`，而Opera9则提供了`e.stacktrace`。通过解析这些信息，我们可以提取出脚本的绝对路径： ```javascript var getCurrAbsPath = function() { var a = {}, stack; try { a.b(); } catch (e) { stack = e.stack || e.sourceURL || e.stacktrace; } var rExtractUri = /(?:http|https|file):\/\/.*?\/.+?.js/; var absPath = rExtractUri.exec(stack); return absPath[0] || ''; }; ``` 对于更早版本的IE（5.5至9），由于不支持`document.currentScript`，我们需要遍历整个文档中的`<script>`标签来寻找状态为`interactive`的元素，因为这代表脚本正在执行。以下是实现方法： ```javascript var getCurrAbsPath = function() { var scripts = document.scripts; var isLt8 = ('' + document.querySelector).indexOf('[native code]') === -1; for (var i = scripts.length - 1, script; script = scripts[i--];) { if (script.readyState === 'interactive') { return isLt8 ? script.getAttribute('src', 4) : script.src; } } }; ``` 这里涉及到了IE的`readyState`属性，它表示`<script>`元素的加载和执行状态。这个属性可能有以下值：`uninitialized`（未初始化）、`loading`（正在加载）、`loaded`（加载完成）、`interactive`（执行中）和`complete`（执行完毕）。在IE5.5到9的版本中，我们需要监听`readyState`变化，因为`loaded`和`complete`状态的出现顺序不确定，可能只会出现其中一个。通常建议动态添加`<script>`元素时，先设置`src`属性，再将其添加到DOM中，这样可以更容易地监测状态。 另外，在所有浏览器中，我们还可以通过订阅`window.onerror`事件来获取脚本的绝对路径。`onerror`事件处理函数接收三个参数：错误消息（msg）、发生错误的脚本URL（url）以及错误行号（num）。因此，只要捕获到错误，就可以从`url`中获取到当前脚本的路径。 总结来说，获取JavaScript脚本的绝对路径涉及到了浏览器兼容性问题，需要根据不同的浏览器特性来实现。对于现代浏览器，`document.currentScript.src`是最简洁的方法；而在老版本的IE和其他浏览器中，我们需要借助错误堆栈信息或遍历`<script>`元素来获取路径。理解这些差异对于编写跨浏览器的JavaScript代码至关重要。