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

Question

我有一个页面有几个链接，并且有些链接指向完全相同的URL。当其中一个重复的链接被点击时，我想将文本（可链接的href文本）添加到所点击（或悬停）的链接中。

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

我尝试过一些方法，但我仍在学习JavaScript（我羡慕你们所有人），并担心越努力就越弄糟它。我知道我可能需要使用hover或以某种方式更改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;
});

例子 当我点击"dog"链接时，我希望在新的浏览器标签页/窗口中打开 URL 为 "http://www.1.com" 的网址。

当我点击"cat"链接时，我希望在新的浏览器标签页/窗口中打开 URL 为 "http://www.2.com" 的网址。

当我点击"bird"链接时，我希望在新的浏览器标签页/窗口中打开"bird"的 URL。

当我点击"frog"链接时，我希望在新的浏览器标签页/窗口中打开"frog"的 URL。

所以，任何具有"http://www.3.com"作为href的链接都将忽略 "http://www.3.com"并代替打开刚刚单击的文本。

另外，我无法向链接/HTML添加ID、Class、脚本等，因此我必须通过 JS 引用 href 并且不在 HTML 内部解决所有这些问题。

- Gaberham

---

所以您想将href添加到元素的文本中？ - Abdul Ahmad

你的问题不够清晰，需要你的帮助我们才能帮助你。确保你已经阅读了 http://stackoverflow.com/help/how-to-ask - Pedro Lobito

我不明白，你只是想做这个吗 -> http://jsfiddle.net/adeneo/s5t2vhsq/ - adeneo

Abdul - 更好地用文本替换 href（请参见我的编辑） Pedro - 谢谢，抱歉，我将努力在将来更清楚明确。 Adeneo - 抱歉，希望我的编辑/示例能够澄清。 - Gaberham

Answer 1

尝试这样做：

像这样尝试：

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

JSFIDDLE DEMO

- Rahul Tripathi

---

谢谢Rahul，但我想更改最终标签/窗口的URL。所以在你的例子中，我希望一个新的标签/窗口有URL“http://ClickMe”，而不是href =“xx”中的内容。 - Gaberham

Answer 2

不确定这是否正是您所要求的，但此演示是一个示例，我在其中获取 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 Ahmad

---

谢谢Abdul，这很接近了，但我想要的是通过刚刚点击的文本来改变新页面/标签页/URL。抱歉让你感到困惑。 - Gaberham

Answer 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());
});

- Gaberham