Javascript 多个子级别ul li标记内的html筛选器搜索

我有下面的代码，问题是当我搜索“比利”时，我得到了所有三个“比利”，这就是我所期望的

然而，当我搜索“Bob”时，我只得到两个父级“Bob”。为什么搜索循环只搜索每个级别的账单而不搜索Bob

现在，现在只有一个子列表，这将增加到多个子列表。我想要的是在所有级别执行搜索

<input type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name">

函数myFunction（）{
var输入、滤波器、ul、li、a、i；
输入=document.getElementById（“myInput”）；
filter=input.value.toUpperCase（）；
ul=document.getElementById（“myUL”）；
li=ul.getElementsByTagName（“li”）；
对于（i=0；i-1）{
李[i].style.display=“”；
}否则{
li[i].style.display=“无”；
}
}
}

隐藏元素时，需要考虑嵌套的

li

。现在，如果您观察

a.innerHTML

返回的值，您将看到由于嵌套的原因，它会返回4次。因此，当您隐藏父

li

Billy首先被击中时，包含Bob的子

li

也被隐藏

修改代码段以引用

a

的父项，而不是直接查看所有

li

标记

函数myFunction（）{
var输入、滤波器、ul、li、a、i；
输入=document.getElementById（“myInput”）；
filter=input.value.toUpperCase（）；
ul=document.getElementById（“myUL”）；
li=ul.getElementsByTagName（“li”）；
对于（i=0；i-1）{
a、 parentElement.style.display=“”；
}否则{
a、 parentElement.style.display=“无”；
}
}
}

隐藏元素时，需要考虑嵌套的

li

。现在，如果您观察

a.innerHTML

返回的值，您将看到由于嵌套的原因，它会返回4次。因此，当您隐藏父

li

Billy首先被击中时，包含Bob的子

li

也被隐藏

修改代码段以引用

a

的父项，而不是直接查看所有

li

标记

函数myFunction（）{
var输入、滤波器、ul、li、a、i；
输入=document.getElementById（“myInput”）；
filter=input.value.toUpperCase（）；
ul=document.getElementById（“myUL”）；
li=ul.getElementsByTagName（“li”）；
对于（i=0；i-1）{
a、 parentElement.style.display=“”；
}否则{
a、 parentElement.style.display=“无”；
}
}
}

函数myFunction（）{
var input=document.getElementById（“myInput”）；
var filter=input.value.toUpperCase（）；
var ul=document.getElementById（“myUL”）；
var li=ul.getElementsByTagName（'li'）；
对于（变量i=0；i=0）{
li[i].style.display=''；
}
否则{
li[i].style.display='none'；
}
}
}
}

函数myFunction（）{
var input=document.getElementById（“myInput”）；
var filter=input.value.toUpperCase（）；
var ul=document.getElementById（“myUL”）；
var li=ul.getElementsByTagName（'li'）；
对于（变量i=0；i=0）{
li[i].style.display=''；
}
否则{
li[i].style.display='none'；
}
}
}
}

谢谢Zack，但即使这样也只限于一个级别的家长。所以，若我们有子级别列表，那个么更新后的代码片段就不能证明你们错了。3层仍然可以得到所有4个Bob。谢谢Zack，但即使这样也只限于一个级别的父级。所以，若我们有子级别列表，那个么更新后的代码片段就不能证明你们错了。3层它仍然得到所有4个Bob。

function myFunction() {
    var input = document.getElementById("myInput");
    var filter = input.value.toUpperCase();  
    var ul = document.getElementById("myUL");      
    var li = ul.getElementsByTagName('li');

    for (var i = 0; i < li.length; i++) {
        var name = li[i].innerHTML;
        var parent =li[i].parentElement;

        if(parent.tagName == "UL"){
            if (name.toUpperCase().indexOf(filter) >= 0) {
                li[i].style.display = '';
            }
            else{
                li[i].style.display = 'none';
            }
        }
    }
}