我正在一个静态网站上工作而不使用 SSG 并在本地环境中测试它时手动创建所有页面它很好但是当我托管它时我需要更改域名并且弄乱了文件的位置在 html 页面的头部和正文中，所以我正在寻找通过将基本 url 分配给变量然后将其插入无效的 head 标记来解决该问题，所以我遇到了这个解决方案
这就是我想要实现的在 <head> 中动态添加链接样式表
但问题是我有多个样式表和 js 文件，这不是解决它的理想方法，所以我如何才能在不弄乱我网页上的代码的情况下实现这一点，例如变量或附加函数之类的东西让我添加一个域/基本 url 一次，然后就可以完成其余的工作。
类似的东西，但对于静态页面
<link href="<?=getThemeURI()?>/assets/css/theme.css" rel="stylesheet"/>
如果可能的话，我想有一个 js 解决方案
使用 javascript，您可以使用 window.location 获取当前域
`${window.location.protocol}//${window.location.hostname}`
所以当你不需要支持旧的浏览器时，你可以用简单的方法来做
const stylesheets = document.querySelectorAll('link[rel="stylesheet"]');
const domain = `${window.location.protocol}//${window.location.hostname}`
stylesheets.forEach((sheet) => {
const href = sheet.getAttribute('href');
sheet.setAttribute('href', `${domain}/${href}`);
});
所以在你的样式表中你只需要写路径，例如'assets/css/theme.css'。域将通过 javascript 添加。
如果您当前的域不是您的 themeURL，那么您可以设置一个配置文件并从那里通过 ajax 调用获取该信息。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句