如何删除元素

时间:2016-02-02 23:44:51

标签: javascript arrays

我需要一些帮助(在代码下你可以看到我需要的东西)

这是代码:

HTML

<input type="number" id="elementnr">
<button onclick="theFunction()">Remove it</button>
<p id="theElements"/>

JAVASCRIPT

<script>
var cars = ["Bentley", "Ferrari", "BMW", "Mercedes", "Lamborghini"];
document.getElementById("theElements").innerHTML = cars;

function theFunction() {

    delete cars[3];
    document.getElementById("theElements").innerHTML = cars;

}
</script>

现在这个代码当你单击按钮时它会删除第三个元素(Mercedes)因为我们给了那个函数但是我想知道是否有任何方法来编辑代码所以当我在文本框中键入数字4并单击它删除了第4个元素的按钮,或者如果我在文本框中键入2并单击按钮则删除第2个元素等。

1 个答案:

答案 0 :(得分:1)

您可以阅读Input HTML元素的'value'属性。

在JS的Array元素上使用delete运算符不会删除给定的元素,而是将其值设置为undefined,因此数组的长度保持不变,并且会导致许多错误。

通常,splice函数用于从JavaScript数组中删除某些内容。

var cars = ["Bentley", "Ferrari", "BMW", "Mercedes", "Lamborghini"];
var carsList = document.getElementById("carsList");
var elementIndex = document.getElementById("elementIndex");

function removeElementByIndex() {
    cars.splice(elementIndex.value,1);
    setHtml(carsList, cars);
}

function setHtml(node, content){
  node.innerHTML = content;
}

setHtml(carsList, cars);
<input type="number" id="elementIndex">
<button onclick="removeElementByIndex()">Remove it</button>
<p id="carsList"></p>