Question

我不是要求任何人为我编码。请告诉我我错过了什么或我的代码做错了什么。

我的javascript程序应该像这样运行：

按下按钮后，会出现一个简单的乘法表，并覆盖“表应该在这里”字样。
按下另一个按钮，应出现另一个简单的乘法按钮，并覆盖前一个乘法表。

我能够使乘法表出来但问题是，它不会覆盖前一个表。它只是在前一个底部创建了另一个表。请帮忙。这不是一个家庭作业..我很新，只是试图学习使用简单代码创建一个有点复杂程序的所有可能性。

<script type="text/javascript">
    function x()
    {
        var a=1;
        for(a=0;a<=10;a++)
        {
            var total = 2 * a;
            var newHeading = document.createElement("p");
            var h1Text = document.createTextNode("2 x " + a + " = " + total);
            newHeading.appendChild(h1Text);
            document.getElementById("dname1").appendChild(newHeading);
        }
    }

    function y(total)
    {
        var a=0;
        for(a=0;a<=10;a++)
        {
            var total = 3 * a;
            var newHeading = document.createElement("p");
            var h1Text = document.createTextNode("3 x " + a + " = " + total);
            newHeading.appendChild(h1Text);
            document.getElementById("dname2").appendChild(newHeading);
        }
    }
    </script>
    </head>
    <body>

    <h1>Date and Hours</h1>
   <p>Click a button</p>
   <p id="dname1">Table of 2 should be here</p>
    <p id="dname2">Table of 3 should be here</br></p>

   <button type="button" onclick="x()">Table of Two</button>
   <button type="button" onclick="y()">Table of Three</button>

Answer 1

在添加任何内容之前，您应该清除两个表：http://jsfiddle.net/2NtXH/2/。

// setting the innerHTML to an empty string basically removes its contents
document.getElementById("dname1").innerHTML = "";
document.getElementById("dname2").innerHTML = "";

Answer 2

如果你想使用jQuery，只需执行此操作

$("#dname1").html("");
$("#dname2").html("");

在Javascript中更改文本

2 个答案: