javascript - 使用 switch 语句更改页面正文

Question

我正在尝试制作一个菜单，当单击 5 个按钮中的任何一个时，它将更改页面的正文而不更改菜单或其他任何内容，我还没有开始重新加载页面的工作，我仍然停留在这部分！

来自 index.html

<div id="quickstats">
    <p>
        <a href="#" onclick="quickStats(0);"><img src="./images/qstata.png" /></a>
        <a href="#" onclick="quickStats(1);"><img src="./images/qstatb.png" /></a>
        <a href="#" onclick="quickStats(2);"><img src="./images/qstatc.png" /></a>
        <a href="#" onclick="quickStats(3);"><img src="./images/qstatd.png" /></a>
        <a href="#" onclick="quickStats(4);"><img src="./images/qstate.png" /></a>
    </p>
</div>

来自 java.js

quickStats(x)
{
    var print;
    switch (x)
    {
        case 0:
            print="<p>Page A</p>"
            break;
        case 1:
            print="<p>Page B</p>"
            break;
        case 2:
            print="<p>Page C</p>"
            break;
        case 3:
            print="<p>Page D</p>"
            break;
        case 4:
            print="<p>Page E</p>"
            break;
    }
    document.getElementById("currentactivity").innerHTML=print;
}

Answer 1

我发现您的代码有两个问题：

1. 它应该是function quickStats(x)
2. 您需要有一个带有 id 的元素，currentactivity最后一行才能执行任何操作。添加<div id="currentactivity"></div>到 HTML。