Question

我试图获得一个链接，以便在每次点击时更改javascript innerHTML。

function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    }
    if (id.innerHTML==="innerHTML1"){
        id.innerHTML="innerHTML2";
    }
}

<a id="id" href="javascript:id_1('id')">innerHTML1</a>

我希望它从innerHTML1更改为innerHTML2更改为innerHTML1更改为innerHTML2，依此类推链接。

现在它只从innerHTML1切换到innerHTML2

Answer 1

您需要使用else if作为第二个if语句。

代码中的逻辑在第二次单击时的工作方式如下（当内容为innerHTML2时）：

第一个if语句测试内容是否为innerHTML2，因此内容更改为innerHTML1（你想要的）。
第二个if语句测试内容是否为innerHTML1，它是（因为它刚刚在步骤1中更改）所以内容被更改回innerHTML1（不是你想要的）。

因此解决方案应如下所示：

function id_1(a){
    var id = document.getElementById(a); 
    if (id.innerHTML=="innerHTML2"){
        id.innerHTML="innerHTML1";
    }else if (id.innerHTML=="innerHTML1"){
        id.innerHTML="innerHTML2";
    }
}

要强调一点，您可以保持代码的方式相同，但使用return来确保只使用一个if语句。

function id_1(a){
    var id = document.getElementById(a); 
    if (id.innerHTML=="innerHTML2"){
        id.innerHTML="innerHTML1";
        return;
    }

    if (id.innerHTML=="innerHTML1"){
        id.innerHTML="innerHTML2";
        return;
    }
}

Answer 2

您只需在else语句之间使用if：

function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    } else if (id.innerHTML==="innerHTML1"){
        id.innerHTML="innerHTML2";
    }
}

如果没有else，您的第二个if会受到第一个if所做更改的影响。

由于innerHTML只有两种状态，你实际上可以简化为：

function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    } else {
        id.innerHTML="innerHTML2";
    }
}

Answer 3

你只是错过了其他人：

<html>
<head>
<script>
function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
        id.innerHTML="innerHTML1";
    }
    else if (id.innerHTML==="innerHTML1"){
        id.innerHTML="innerHTML2";
    }

}
</script>
</head>
<body>
<a id="id" href="javascript:id_1('id')">innerHTML1</a>
</body>
</html>

小提琴：http://jsfiddle.net/WCgAS/

Answer 4

它实际上一直在进行切换，但是当你编写它时，它会切换到“innerHTML 1”，然后再切换回“innerHTML 2”

所以只需将第二个“if”更改为“else if”

<html>
<head>
<script>
function id_1(a){
    var id = document.getElementById(a);
    if (id.innerHTML==="innerHTML2"){
    id.innerHTML="innerHTML1";
    }
    else if (id.innerHTML==="innerHTML1"){
    id.innerHTML="innerHTML2";
    }
}
</script>
</head>
<body>
<a id="id" href="javascript:id_1('id')">innerHTML1</a>
</body>
</html>

如何在javascript中多次获取更改innerHTML的链接

4 个答案: