logo标签列表

如何使用JavaScript更改<a>的innerText

javascript
8
当我点击“显示详情”链接时，它应该变成“隐藏详情”。我尝试了以下代码，但它不起作用：
当我点击“显示详情”链接时，它应该变成“隐藏详情”。我尝试了以下代码，但它不起作用：
out.print("<a href=\"javascript:parent.showHideDetails('"+id+"',this);\">show details</a>");

function showHideDetails(id,obj) {
    try
    {

        alert(obj.innerText);
        obj.innerText = 'hide details';
    }
    catch (err)
    {
        alert(err);
    }

}
4个回答
10
问题在于 href 属性中的 this 指向的不是锚点。你可以在 href 中传递一个标识符，然后将锚点元素赋予相同的 id 属性值；接着使用 document.getElementById 获取锚点。
示例：
out.print("<a href=\"javascript:parent.showHideDetails('"+id+"','anchor_1');\" id=\"anchor_1\">show details</a>");

function showHideDetails(id,identifier) {
    try
    {
        var obj = document.getElementById(identifier);
        alert(obj.innerText);
        obj.innerText = 'hide details';
    }
    catch (err)
    {
        alert(err);
    }
}
2

您的问题缺乏详细信息，以下是一些可能性:

从内联处理程序中删除 parent. 并改为 onclick：

"<a href=\"#\" onclick=\"javascript:showHideDetails('"+id+"',this);\">show details</a>"

也许 showHideDetails() 函数不是全局函数。

也许你使用的浏览器不支持 innerText。可以尝试使用 innerHTML。

obj.innerHTML = 'hide details';
1

InnerText 是那些在不同浏览器中命名不同的浏览器挑剔的元素之一。如果你刚开始学习 JavaScript，我建议使用像 jQuery 这样的框架，因为调用函数更简单：

$('#linkID').text('show');

使用框架比手动设置每个浏览器变体更容易。框架会为您完成所有这些工作。

0

this 将指向 DOM 窗口而不是 <a> 标签。因此，请使用 onclick 属性来执行。

out.print("<a href=\"#\" onclick=\"showHideDetails('"+id+"',this);\">
show details</a>");
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接