Javascript 从无序列表或有序列表中添加和删除数组元素

我有一个无序的随机元素列表：

<ul id="uList">
    <li>First</li>
    <li>Second</li>
    <li>Third</li>
    </ul>

<p>You have selected: </p><p id="result"></p>

我创建了一个函数，当我点击无序列表元素时可以切换，这样我就可以在数组中添加和删除元素

function onClickItems() {
    this.classList.toggle('selected');
    if (this.classList.contains('selected')){
    selected = this.innerHTML;
    arr1.push(selected);
    document.getElementById("result").innerHTML = arr1.join("<br>");
 } else {
    lookValueArray(returenIndex());
    document.getElementById("result").innerHTML = arr1.join("<br>");
    }
 }

第二，从无序列表中查找所选索引的值，如果它等于所选索引，则将其删除

function lookValueArray (inde1) {
    if (arr1[inde1].value = selected) {
        arr1.splice(inde1, 1);
    } 
}

仍然是相同的输出。它添加得非常完美，但不会删除它。此外，即使我选择了要删除的第二个元素，它也只会删除最后一个输入到数组中的元素

---

顺便说一句，我尝试使用

arr1.splice（0，0，selected）

而不是

arr1.push（selected）

，这样我可以让元素在特定位置进入数组，但这也不起作用。

在代码中，当您第一次单击某个元素时，您选择的

变量未定义。当您第一次单击其中一个元素时，需要向
selected
添加一个值，因此只需移动
selected=this.innerHTML在if语句之外。您也不需要在
lookValueArray（）
函数中使用if语句，这已经是错误的，因为您正在执行asignment而不是使用（
=
或
==
进行验证）。请参见下面的工作片段：


var elems=document.getElementsByTagName（'li'）；
选择var；
var arr1=[]；
from（elems）.forEach（v=>v.addEventListener（“单击”，onClickItems，false））；
函数onClickItems（）{
selected=this.innerHTML；
this.classList.toggle（'selected'）；
if（this.classList.contains（'selected'））{
//selected=this.innerHTML；//注释了此行并将其添加到if语句之外的上方
arr1.推送（已选择）；
document.getElementById（“结果”）.innerHTML=arr1.join（“
”）；
}否则{
lookValueArray（returenIndex（））；
document.getElementById（“结果”）.innerHTML=arr1.join（“
”）；
}
}
函数lookValueArray（inde1）{
arr1.拼接（inde1，1）；
}
函数returenIndex（）{
var indexx=arr1.indexOf（选定）；
返回（indexx）；
}
。已选定{
颜色：#f00；
}

首先
第二
第三

您已选择：

在代码中，当您第一次单击其中一个元素时，所选的
变量未定义。当您第一次单击其中一个元素时，需要向
selected
添加一个值，因此只需移动
selected=this.innerHTML在if语句之外。您也不需要在
lookValueArray（）
函数中使用if语句，这已经是错误的，因为您正在执行asignment而不是使用（
=
或
==
进行验证）。请参见下面的工作片段：


var elems=document.getElementsByTagName（'li'）；
选择var；
var arr1=[]；
from（elems）.forEach（v=>v.addEventListener（“单击”，onClickItems，false））；
函数onClickItems（）{
selected=this.innerHTML；
this.classList.toggle（'selected'）；
if（this.classList.contains（'selected'））{
//selected=this.innerHTML；//注释了此行并将其添加到if语句之外的上方
arr1.推送（已选择）；
document.getElementById（“结果”）.innerHTML=arr1.join（“
”）；
}否则{
lookValueArray（returenIndex（））；
document.getElementById（“结果”）.innerHTML=arr1.join（“
”）；
}
}
函数lookValueArray（inde1）{
arr1.拼接（inde1，1）；
}
函数returenIndex（）{
var indexx=arr1.indexOf（选定）；
返回（indexx）；
}
。已选定{
颜色：#f00；
}

首先
第二
第三

您已选择：

在您的问题中，您缺少函数
onClickItems
的结束语
}
。那是打字错误吗？是的，很抱歉。我刚刚修复了它。
如果（arr1[inde1].value=selected）
-应该是
==
，而不是
=
。您正在执行赋值，而
if
条件将始终是真实的，因为此时
selected
是一个非空字符串。在您的问题中，您缺少函数
onClickItems
的结束
}
。那是打字错误吗？是的，很抱歉。我刚刚修复了它。
如果（arr1[inde1].value=selected）
-应该是
==
，而不是
=
。您正在执行一个赋值，而
if
条件将始终是真实的，因为此时
selected
是一个非空字符串。
function returenIndex () {
    var indexx = arr1.indexOf(selected);
    return(indexx);
}

function lookValueArray (inde1) {
    if (arr1[inde1].value = selected) {
        arr1.splice(inde1, 1);
    } 
}