使用JavaScript动态调用元素(锚点)

Question

我将如何使用JavaScript获取锚标记的文本.我知道如何通过在标签上附加一个ID来做到这一点,但我想知道是否还有使用"this"关键字来做到这一点.

示例HTML代码段:

<ul>
    <li><a href="javascript:alertText(this);">Link One</a></li>
    <li><a href="javascript:alertText(this);">Link Two</a></li>
</ul>

JavaScript功能:

function alertText(callingElement) {
    alert(callingElement.text);
}

这不起作用(警报打印出"未定义")因为"this"关键字似乎指向Window对象而不是调用该函数的锚.

如果有必要,可以使用JQuery.

Answer 1

您可以使用.innerHTML，但要传递this，您需要使用该onclick属性。

<ul>
    <li><a href="#" onclick="alertText(this);">Link One</a></li>
    <li><a href="#" onclick="alertText(this);">Link Two</a></li>
</ul>

JS：

function alertText(callingElement) {
    alert(callingElement.innerHTML);
}

或者您可以使用.innerText或 ，.textContent具体取决于用户的浏览器。

JS：

function alertText(callingElement) {
    alert(callingElement.textContent || callingElement.innerText);
}

更新：

啊，等等，它是一个锚元素，所以它确实有一个.text属性，所以你原来的函数将起作用（至少在支持 HTML5 的浏览器中）。

JS：

function alertText(callingElement) {
    alert(callingElement.text);
}