在 HTML 中，如何在按钮内创建按钮

Question

我制作了一个按钮并在段落中放置了一个 ID，以便在提到某个功能时输出一些文本，但是当我单击第一个按钮时如何放置第二个按钮。（例如，如果我单击 1-2，它会显示按钮 1 和 2 以及 3-4 输出 3 和 4）如果您能解释一下，请尽量保持简单，因为我最近才开始编程。我曾尝试在一个按钮用于为另一个按钮编码的函数脚本中更改 innerHTML，但这不起作用。<button class="button" onclick="contact()">Contact</button><p id=( "Identifier")></p><script>  function contact() {    document.getElementById("identifier").innerHTML = "<button class="    button " onclick="    email()    ">email</button> <button class="    button " onclick="    email()    ">phone</button>";  }  function email() {    document.getElementById("identifier").innerHTML = "Email here";  }  function phone() {    document.getElementById("identifier").innerHTML = "Phone here";  }</script>当我使用上面的代码单击一个按钮时，它下面应该会显示另外两个按钮，当我单击它们时，（在此，电子邮件或电话）的结果应该显示，但不显示。

Answer 1

首先， id被声明为<p id="identifier"></p>而不是<p id=( "Identifier")></p>。 其次，您可以使用反引号来编写多行字符串。

请修改您的代码如下

function contact() {

  document.getElementById("identifier").innerHTML = `

  <button class="button" onclick="email()">email</button> 

  <button class="button" onclick="phone()">phone</button>`;

}

function email() {

  document.getElementById("identifier").innerHTML = "Email here";

}

function phone() {

  document.getElementById("identifier").innerHTML = "Phone here";

}

<button class="button" onclick="contact()">Contact</button>

<p id="identifier"></p>