在 JavaScript 中，如何获取 JavaScript 文件的 URL，而不是位置 URL？

Question

我想使用查询字符串参数，这样我就可以指定 DOM 元素的名称。

我有一些需要标题高度的代码，我希望该代码适用于任何主题。只有有时标头使用<header> 标记，有时它有一个特定的标识符，有时它是一个特定的类......为了能够一遍又一遍地重用该代码，我想将它包含在一种方式如：

<script src="https://www.example.com/js/my-script.js?c=header"></script>

我想要做的是从该 JavaScript URL 中获取“?c=header”部分，以使用jQuery(".header") 向搜索发送一个 DOM 对象。我们有没有办法从正在执行的 JavaScript 中知道 JavaScript 本身的 URL？

显然，我知道window.location.href，这不是我要查找的 URL。

Answer 1

正如@Kaiido 在评论中提到的，document.currentScript 参数可让您访问当前正在运行的<script> 标记。只有一个小技巧，该参数是在第一次传递时定义的，而不是在脚本中执行函数时。

因此，可以做的是将这些信息，或者至少是您需要从该对象中获得的信息，保存在全局范围内或对象中的静态变量中。

就我而言，我只是做了以下事情：

// Script to tweak things on many websites
var this_script_url = document.currentScript.src;

jQuery(document).ready(function()
  {
    // at this point: "document.currentScript === null"

    var qs = this_script_url.split("?", 2);
    if(qs && 2 == qs.length)
    {
      ... // handle qs[1] which is the query string (a=1&b=3&...)
    }
  });

请确保不要使用过于笼统的全局名称。它应该包括您的脚本名称或其缩写。否则你很可能会与另一个脚本的全局冲突。

现在，如果您有一个原型对象，我建议您使用静态成员而不是全局成员。

var my_class = {};

my_class.script_url = document.currentScript.src;

// and later you can reference it directly as in:
url = my_class.script_url;

这样您就更有可能避免冲突问题（唯一需要在发生冲突时更改的是名称my_class）。

此时，ES5 或 ES6 类关键字不提供创建变量的功能。