单击时将一个按钮替换为另一个

Question

我是 stackoverflow 的新手，我也是一名业余 javascript 程序员。 我正在尝试制作一个程序，当我单击一个按钮时，会出现一个提示，询问我的名字。 除此之外，我还希望该按钮消失，并替换为另一个具有以下值的按钮：Hello 'name'。 我该怎么做呢？ 我目前在 javascript 中的代码要求我输入我的名字，但不会使按钮消失。 我目前的js如下：

var button = document.getElementById("button");
function naming() {
    var getName = prompt("What is your name?");
    button.style.display = "none";
};

我的按钮 html：

<button id="button" onclick="naming();"> Name Here</button>

Answer 1

这会起作用，它不会删除按钮，而是再次将其用于用户输入的名称。

HTML

<button id="button">Name here</button>

JS

var button = document.getElementById('button');
button.addEventListener('click', function() {
    var name = prompt("What is your name?");
    this.innerHTML = name
}, false);

http://jsfiddle.net/rYU7Q/

Answer 2

另一种方法

<button class="btn btn-primary" id = "del-btn">Old btn</button>
<div id = "sho-btn"></div>


 <script>
    var a = "<button class='btn btn-primary'>New Button</button>";
    document.getElementById("del-btn").style.visibility = 'hidden';
    document.getElementById("sho-btn").innerHTML = a;
    </script>