如何在 Javascript 中设置页面的基本 href?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3494954/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 04:53:41  来源:igfitidea点击:

How do I set a page's base href in Javascript?

javascripthrefbase

提问by Zach Gardner

I want to set a page's base href attribute in Javascript based off of the current hostname. I have generated HTML pages that can be viewed on different hostnames, which means generating a base href tag will work in one hostname but will be incorrect in the other.

我想根据当前主机名在 Javascript 中设置页面的基本 href 属性。我生成了可以在不同主机名上查看的 HTML 页面,这意味着生成基本 href 标签将在一个主机名中工作,但在另一个主机名中将不正确。

回答by Zach Gardner

The correct way of doing this is to do a document.write of the tag based off the current hostname:

正确的做法是根据当前主机名对标签进行 document.write 操作:

Correct:

正确的:

<script type="text/javascript">
document.write("<base href='http://" + document.location.host + "' />");
</script>

This method has produced correct results in IE, FF, Chrome, and Safari. It produces a (correct) different result than doing the following:

此方法在 IE、FF、Chrome 和 Safari 中产生了正确的结果。它产生一个(正确的)与执行以下操作不同的结果:

Incorrect:

不正确:

<script type="text/javascript">
var newBase = document.createElement("base");
newBase.setAttribute("href", document.location.hostname);
document.getElementsByTagName("head")[0].appendChild(newBase);
</script>

回答by Mahieddine M. Ichir

I think you'd better do it this way

我想你最好这样做

    <script type="text/javascript">
        document.head.innerHTML = document.head.innerHTML + "<base href='" + document.location.href + "' />";
    </script>

As location.hostnamedoes not return the application context root! You could also log the document.locationon the console console.logto see all available metadata on document.location.

由于location.hostname不返回应用程序上下文根!您还可以登录document.location控制台console.log查看所有可用的元数据document.location

回答by Aleem Latif

document.write("");

<script>
document.write("<base href='"+ window.location.protocol +'//' + window.location.host + "' >");
</script>

回答by cody mikol

I have to disagree with the top answer. The only reason the "Incorrect" solution is wrong is that is does not account for the protocol so it will fail.

我不得不不同意最高答案。“不正确”解决方案错误的唯一原因是它没有考虑到协议,所以它会失败。

A working solution that I have to account for protocol / host / port is the following

我必须考虑协议/主机/端口的工作解决方案如下

    var base = document.createElement('base');
    base.href = window.location.protocol + '//' + window.location.hostname + (window.location.port ? ':' + window.location.port : '');
    document.getElementsByTagName('head')[0].appendChild(base);

This currently works fine in all major browsers including IE11

这目前在包括 IE11 在内的所有主要浏览器中都可以正常工作

I have used this to make an npm package that also supports adding a suffix to the end of this base href if anyone is interested

我已经用它来制作一个 npm 包,如果有人感兴趣的话,它也支持在这个 base href 的末尾添加一个后缀

https://www.npmjs.com/package/dynamic-base

https://www.npmjs.com/package/dynamic-base

https://github.com/codymikol/dynamic-base

https://github.com/codymikol/dynamic-base