如何在 html 页面上动态添加路由到脚本 src

How to dynamically add route to script src on an html page?

本文关键字：路由 添加 脚本 src 动态 html      更新时间：2023-09-26

>我有一个HTML页面，它引用了一些脚本，如下所示：

<script charset="utf-8" src="Content/Styles/ThemeForest/assets/js/vendors.js"></script>
<script charset="utf-8" src="Content/Styles/ThemeForest/assets/js/app.js"></script>

问题是，当我将我的网站上传到服务器时，它不再工作。我想如果我改为添加 Web 应用程序名称，它将再次工作。像这样：

<script charset="utf-8" src="MySite/Content/Styles/ThemeForest/assets/js/vendors.js"></script>
<script charset="utf-8" src="MySite/CContent/Styles/ThemeForest/assets/js/app.js"></script>

现在，问题是，我可能不知道 Web 应用程序名称上传到服务器后会是什么样子......因此，我想将应用程序名称动态添加到 src。

我

注意到有一个名为window.location.pathname的JavaScript函数，它可以为我带来Web应用程序名称（如果有的话）。我可以将其连接到路线的其余部分，它应该可以工作。

现在，问题是，这一切都在一个常规的HTML页面上。有没有办法使用基本的 JavaScript 函数为这些脚本标签设置自定义路由？还是其他想法？

您可以使用类似 $script 的东西，只需在 app.run 或任何其他位置添加该代码行，并使用要加载的 js 文件的路由数组调用它。您说您可以获取 Web 应用程序名称，因此只需传递与脚本路径连接的应用程序名称： 

var dependenciesLoadingFactory = function(deps) {
    return ['$q', '$rootScope', function($q, $rootScope) {
        var deferred = $q.defer();
        $script(deps, function() {
            $rootScope.$apply(function() { deferred.resolve(); });
        });
        return deferred.promise;
    }];
};

如果您链接到以目录或文件名本身开头的源文档（就像您在问题中所做的那样），查找将从当前文件（这将是包含脚本标签的 html 文件）所在的同一文件夹中开始查找它。您还可以链接到相对于当前位置的父目录中的文件，如下所示：

../file.js

您也可以链接到以斜杠开头的路径：

/dir/to/your/file.js

这将开始查找您网页的根目录，即您的域或子域指向的目录。您无法成功链接到根目录上方的文件。

最后，如果您的文件位于另一台服务器上，请确保包含完整路径，包括 http://代码段：

http://example.website.com/dir/file.js

在正常情况下，真的没有理由偏离这些方法，但是如果你绝对必须动态设置一个目录，我建议你使用 php，因为它是服务器端的，因此对用户来说更快，如果他们禁用了 javascript，这很重要（如果你以这种方式链接到其他文件，如样式表，这很重要）：

<?php $directory = '/dir/'; ?>
<script src="<?php print $directory; ?>file.js"></script>

当然，要做到这一点，你的服务器必须运行php。

相关文章：