如果单击，则将 href 文本添加到链接答案

【问题标题】：Add href text to link if clicked如果单击，则将 href 文本添加到链接
【发布时间】：2015-06-25 14:26:20
【问题描述】：

我有一个包含多个链接的页面。一些链接指向相同的确切 URL。当单击这些重复链接之一时，我想将文本（可链接的 href 文本）添加到单击（或悬停？）的链接中。

到目前为止，我似乎只能添加第一个链接的文本，而不是我点击的那个。

我已经尝试了一些东西，但我仍在学习 JavaScript（我羡慕你们所有人），而且我担心我越努力就会把它弄得一团糟。我知道我可能不得不使用悬停或以某种方式更改 getElementsByTagName("a")[0]... 任何帮助将不胜感激！

<p>
<a href="http://www.1.com" target="_blank">dog</a>
<a href="http://www.2.com" target="_blank">cat</a>
<a href="http://www.3.com" target="_blank">bird</a>
<a href="http://www.3.com" target="_blank">frog</a>
</p>

Javascript：

$var anchors = document.querySelectorAll('a[href$="http://www.3.com"]');
Array.prototype.forEach.call(anchors, function (element, index) {
    element.href = document.getElementsByTagName("a")[0].innerHTML;
});

示例当我点击链接“狗”时，我想打开一个新的浏览器选项卡/窗口，其 URL 为“http://www.1.com”

当我点击链接“猫”时，我想打开一个新的浏览器选项卡/窗口，其 URL 为“http://www.2.com”

当我点击链接“鸟”时，我想打开一个新的浏览器选项卡/窗口，其 URL 为“鸟”

当我点击链接“frog”时，我想打开一个新的浏览器选项卡/窗口，其 URL 为“frog”

因此，任何以“http://www.3.com”作为 href 的链接都将忽略“http://www.3.com”，而是打开一个新的浏览器选项卡/窗口，其中包含刚刚单击的文本。

此外，我无法将 ID、类、脚本等添加到链接/HTML，因此我必须弄清楚如何将所有这些作为 JS 引用 href 而不是 HTML 内部。

【问题讨论】：

所以你想将href添加到元素的文本中？
您的问题不清楚，您需要帮助我们，我们才能为您提供帮助。确保您阅读stackoverflow.com/help/how-to-ask
我不明白，你只是想这样做 -> jsfiddle.net/adeneo/s5t2vhsq
Abdul - 更像是用文本替换 href（请参阅我的编辑） Pedro - 谢谢和抱歉，我会在以后尝试更清楚。 Adeneo - 抱歉，我希望我的编辑/示例有助于澄清。

标签： javascript jquery html hyperlink href

【解决方案1】：

试试这样：

<a href="" onClick="javascript:this.innerHTML = 'ChangedClickMe'">ClickMe</a>

JSFIDDLE DEMO

【讨论】：

感谢 Rahul，但我想更改最终的选项卡/窗口 URL。因此，在您的示例中，我希望新选项卡/窗口的 URL 为“ClickMe”，而不是 href="xx" 中的内容。

【解决方案2】：

不确定这是否正是您所要求的，但 THIS DEMO 是我采用 href 并将其附加到文本的示例。

html

<a href='#' onclick='change(this)'>link one</a>
<a href='#' onclick='change(this)'>link two</a>
<a href='#' onclick='change(this)'>link three</a>
<a href='#' onclick='change(this)'>link four</a>

css

a {
    float: left;
    clear: both;
}

javascript

function change(variable) {
    variable.innerHTML = variable.innerHTML + variable.href;
}

【讨论】：

感谢 Abdul，这已经很接近了，但我正在尝试使用我刚刚单击的文本更改新页面/TAB/URL。很抱歉让您感到困惑。

【解决方案3】：

我的一位同事找到了解决方案。谢谢大家的帮助。

选项 1：

替换部分我原来的JS：

"document.getElementsByTagName("a")[0].innerHTML"

与：

"window.location"

或者

选项 2： jsfiddle

替换所有我原来的JS：

$var anchors = document.querySelectorAll('a[href$="http://www.3.com"]');
Array.prototype.forEach.call(anchors, function (element, index) {
element.href = document.getElementsByTagName("a")[0].innerHTML;
});

与：

var anchors = $('a[href$="http://www.3.com"]');
$.each(anchors, function (index, element) {
$(element).attr('href',$(element).text());
});

【讨论】：