Question

在构建HTML页面时，在php中动态设置基础：

$base_line = '<base href="' . $some_path . '/" /> ';
echo $base_line;

现在，我在HTML页面中，我需要访问此信息（$ some_path），搜索几个小时后，我似乎找不到答案。请注意，加载的HTML页面有一个与基础无关的URL，我无法访问PHP代码进行修改。加载的页面可以包含以下网址：http://xyz.com/index.php，但页面中的所有其他链接都将基于基础设置的值，因此我无法使用网页网址获取基础。

我想我可以像图像一样抓取其中一个元素并使用DOM解剖它以找到基础，但应该有一种更简单的方法来实现这一点。有什么想法吗？

使用window.location在这种情况下不起作用，因为它将返回与加载的页面URL相关的内容，而不是其中已设置为基础的内容。

Answer 1

如果要获取基本元素的值，可以执行以下操作：

var baseHref = document.getElementsByTagName('base')[0].href

或者更安全一点：

var bases = document.getElementsByTagName('base');
var baseHref = null;

if (bases.length > 0) {
    baseHref = bases[0].href;
}

更新：更简洁的方式是：

const baseHref = (document.getElementsByTagName('base')[0] || {}).href;

如果baseHref没有<base>，则

getElementsByTagName()可能为空。

更新2：使用querySelector()：

，而不是使用

var base = (document.querySelector('base') || {}).href;
console.log(base);

<base href="http://www.google.com"/>

{{1}}

Answer 2

不需要jquery，jqlite或过时的API。使用较新的querySelector API：

var base = document.querySelector('base');
var baseUrl = base && base.href || '';

Answer 3

我遇到的一个问题是使用element.href并不能准确返回所设置的内容。例如，如果你有这个：

<base href="/some/sub/directory/" />

然后element.href会给你：

document.getElementsByTagName('base')[0].href
# http://example.com/some/sub/directory/

我发现你可以通过使用jQuery attr函数来避免这种情况：

$("base").attr("href")
# /some/sub/directory/

如果你想避免使用jQuery，你也可以使用getAttribute函数：

document.getElementsByTagName('base')[0].getAttribute("href")
# /some/sub/directory/

Answer 4

每个节点都有一个只读属性baseURI，该属性返回绝对基本URL；如果无法获取绝对URI，则返回null。

要获取文档的基本URL，可以使用：document.baseURI。

如果只需要路径名或URL的任何其他部分，则可以创建一个URL对象：

var baseLocation = new URL(document.baseURI);
var pathname = baseLocation.pathname;

Answer 5

如果您无权访问PHP

，可以尝试使用javascript window.location.hostname

如果你想要像

这样的东西

http://www.example.com/blahblah/blah.html

比这三件事情还要落实

window.location.protocol = "http"
window.location.host = "example.com"
window.location.pathname = "blahblah/blah.html"

var url = window.location.protocol + "://" + window.location.host + "/" + window.location.pathname;

您可以查看此article以获取基本网址功能

Answer 6

如果您使用的是jqLite（angularjs默认值），则代码如下所示：

base = angular.element(document.querySelector('base')).attr('href')

有关详细信息，请参阅angular document。

设置完成后，在HTML中获取BASE，但不使用页面URL

6 个答案: