使用Javascript在輸入旁邊插入和刪除span標簽

Question

我有這樣的輸入形式：

<form>
    <label for="name">Name :</label>
    <input type="text" id="name">
</form>

我想使用以下代碼使用Javascript添加span標簽：

var inputName = document.getElementById('name');
var h = document.createElement("span");
var t = document.createTextNode("Hello World");
h.appendChild(t);
inputName.appendChild(h);

但似乎它沒有按我預期的那樣工作。 這是我得到的結果：

<form>
    <label for="name">Name :</label>
    <input type="text" id="name">
        <span>Hellow World</span>
    <input>
</form>

那我該怎么做呢？ 如果您願意告訴我，以后如何刪除該跨度。 謝謝。

Answer 1

您需要使用。 之后 ， 在元素之后添加新元素並刪除該元素，可以使用nextElementSibling.remove（）;。

 var inputName = document.getElementById('name'); var h = document.createElement("span"); var t = document.createTextNode("Hello World"); h.appendChild(t); inputName.after(h); function remove(){ inputName.nextElementSibling.remove(); } 

 <form> <label for="name">Name :</label> <input type="text" id="name"> </form> <button onClick="remove()">Remove</button>