Question

我有一个模板，可以从外部供应商进行屏幕分析，并且需要在导航中包含绝对路径，以便外部托管的内容能够正确链接回我们的网站。

现在，页面/模板由我们的后端开发人员编写的全局菜单应用程序驱动...所以更新我们网站的任何人都会进入并更改菜单及其路径......

现在所有链接都链接到返回根目录的相对路径。

例如

<a href="/">Home</a>
<a href="/news/">News</a>
<a href="/media/">Media</a>
<a href="/other/">Other</a>

我需要一种简单的方法（最好使用jquery）将“http://www.domain.com”添加到每个链接中。

Answer 1

$('a').attr('href', 'http://www.domain.com'+$(this).attr('href'));

Answer 2

请注意，jQuery对象$（“a”）。attr（“href”）不等于$（“a”）。get（0）.href？

$("a").each(function() {
   alert(this.href);
   $(this).attr("href") = this.href;
});

在你的情况下，这可能对你没有帮助，因为你想要静态标记，javascript生成动态内容。但是在这种情况下，您似乎需要静态标记，它必须由服务器发出。

Answer 3

我不建议使用javascript来解决此问题。这应该在页面模板中解决。但是，如果你仍然想要一个jquery解决方案，那么你去吧。假设这些链接有一个特定的类，可以将它们与内部链接区分开来：

$('a.external').each(function() {
    $(this).attr('href', domain_name + $(this).attr('href'));
})

Answer 4

你不需要jquery这么简单的函数....

var elements = document.getElementsByTagName("a");
var eachLink;
for (eachLink in elements) {
 var relativeLink = eachLink.href;
 var absoluetLink = ["http://",domainName,"relativeLink"];
 eachLink.href = absoluteLink.join("");
}

这样的东西应该工作，它运行得更快，你不需要加载整个jquery库只是为了运行6行代码：P

Answer 5

这很简单：

$('a').each(function(){$(this).attr('href',this.href);});

当你读取HTMLAnchorElement的href属性时，你得到绝对路径，所以你可以用JQuery的attr（）方法覆盖它。

Answer 6

我注意到这里的所有解决方案只适用于以“/”字符开头的href属性。如果您想要更强大的功能，可以尝试使用js-uri库。它看起来很酷但我自己没有尝试过，所以我不知道它是多么的错误。

如何使用javascript将相对href属性转换为绝对路径？

6 个答案: