在前端开发中，有时候我们需要获取当前页面上某个脚本引用的URL地址，以便进行相关操作。本文将介绍几种获取被调用脚本URL的方法，并提供示例代码和指导意义。
方法一：document.currentScript
document.currentScript 属性返回当前正在执行的 <script> 元素。因此，在 <script> 标签中使用 document.currentScript.src 就可以获取当前脚本的 URL。
<!-- 被调用的脚本 --> <script src="https://example.com/js/myscript.js"></script>
// 获取被调用脚本的URL const scriptUrl = document.currentScript.src; console.log(scriptUrl); // "https://example.com/js/myscript.js"
需要注意的是，当脚本是通过 defer 或 async 属性加载时，document.currentScript 可能会返回 null，因为此时脚本尚未完成加载和执行。
方法二：DOM 循环查找
另一个获取被调用脚本 URL 的方法是遍历整个 DOM 树，查找所有 <script> 元素，并找到当前正在执行的脚本元素。
<!-- 被调用的脚本 --> <script src="https://example.com/js/myscript.js"></script>
-- -------------------- ---- -------
-- -----------
-------- --------------- -
----- ------- - ----------------------------------------
--- ---- - - -- - - --------------- ---- -
----- ------ - -----------
-- ----------- -- ----------------- --- -------------- -
------ -----------
-
-
-
----- --------- - ----------------
----------------------- -- ------------------------------------上述代码中，我们通过 getElementsByTagName 方法获取所有 <script> 元素，并循环遍历。对于每个脚本元素，我们检查其 src 属性是否存在，并且它的 readyState 是否为 'interactive'。如果满足这两个条件，则表示当前正在执行的脚本就是我们想要找的脚本，可以返回其 src 值。
方法三：使用 Error 对象
还有一种方法是利用 Error 对象来获取被调用脚本的 URL。当 JavaScript 引擎解释执行一个脚本时，会创建一个 Error 对象并将其抛出。该对象包含了一些关于错误的信息，其中一个重要的属性是 stack，它包含了当前执行上下文的堆栈信息。
<!-- 被调用的脚本 --> <script src="https://example.com/js/myscript.js"></script>
-- -------------------- ---- -------
-- -- ----- -------------
-------- -------------- -
--- -
----- --- --------
- -------- -
----- ----- - ------- -- ----------- -- -------------
----- --- - --------------- -----------
------ -------------------- ----
-
-
----- --------- - ---------------
----------------------- -- ------------------------------------上述代码中，我们通过 throw new Error() 来创建一个 Error 对象，并捕获堆栈信息。然后，我们利用正则表达式和字符串操作将堆栈信息中的 URL 提取出来。
需要注意的是，这种方法比较 hacky，而且可能会因为不同浏览器或引擎的实现而不同。在某些情况下，可能无法获取正确的 URL。
总结
以上是三种常用的获取被调用脚本 URL 的方法，它们各有优缺点，可根据具体情况选择合适的方法。需要注意
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/14277