Question

我对Javascript不太熟悉，我正在做一个函数，如果单击一个按钮，它将使用其ID删除该按钮。

我曾尝试过使用其他解决方案来获取ID，但是我对它的逻辑一无所知。

当我单击按钮时，它什么也没做。

var myBtn = document.getElementById("my-btn"),
  mySpan = document.createElement("span");
mySpan.innerHTML = myBtn.innerHTML;
myBtn.parentNode.replaceChild(mySpan, myBtn); <

<div>
  <button id="my-btn">Hello</button>
</div>

Answer 1

为此使用按钮的onclick事件：

var button = document.getElementById("my-btn");

button.onclick = function() {
  //this code will execute whenever the button is clicked
  //inside the handler, "this" refers to the button
  this.parentNode.removeChild(button);
}

<div>
  <button id="my-btn">Hello</button>
</div>

Answer 2

HTML：

<button type="button" id="MyButton">Click me</button>

删除单击的按钮：

const btn = document.getElementById('MyButton');

btn.addEventListener("click", function () {
this.remove();
});

只是隐藏它，将this.remove();替换为this.classList.add('hidden');，并使用CSS可以执行.hidden {display:none;}或添加this.setAttribute('hidden', 'hidden');

remove docs on MDN

Answer 3

HTML

<button id="me"onclick="myFunction()">Try it</button>

JS

 <script>
  function myFunction() {
  var x = document.getElementById("me");
  x.remove();
  }
</script>

单击时如何删除按钮

3 个答案: