javascript实现类似百度搜索

//selut输入要查询的输入框

//Array要查询的数据，conent要放进的容器

// selut input标签class名或id
let SelectData=(Array,conent,selut)=>{
    let arr=[];
    $(conent).html("");//一开始进去你要搜索的内容是空的因为值你还没放进去,如果不清空会导致你搜索是出来的值就会叠加
    if(Array.length!=0){
        let num=$(selut).val();
        for(let j=0;j<Array.length;j++){
            for(var i=0;i<Array[j].length;i++){
                if(Array[j][i].indexOf(num)!==-1){
                    arr.push([Array[j][0],Array[j][1]])
                    let htmlTetx='<li aid='+Array[j][0]+' class="li_shop" >'+Array[j][1]+'</li>';
                    $(conent).append(htmlTetx)
                }
            }
        }
    }
    if(arr.length<=12){
        $(conent).css("height","auto")
    }

}


let retreat=(Array,conent,selut)=>{
    let arr=[];
    const oEvent = window.event;
    if (oEvent.keyCode == 8) {
        if(Array.length!=0){
            setTimeout(()=>{
                $(conent).html("");
                var num=$(selut).val();
                if(num!==""){
                    for(var j=0;j<Array.length;j++){
                        for(var i=0;i<Array[j].length;i++){
                            console.log(Array[j][i])
                            if(Array[j][i].indexOf(num)!==-1){
                                console.log(Array[j][0]+","+Array[j][1])
                                arr.push([Array[j][0],Array[j][1]])
                                let htmlTetx='<li aid='+Array[j][0]+' class="li_shop" >'+Array[j][1]+'</li>';
                                $(conent).append(htmlTetx)
                            }

                        }
                    }
                }else{
                    const str=new Set(Array);
                    const newArray=[...str];
                    for(let j=0;j<newArray.length;j++){
                                let htmlTetx='<li aid='+newArray[j][0]+' class="li_shop" >'+newArray[j][1]+'</li>';
                                $(conent).append(htmlTetx)
                    }
                }
            },100)
        }
        $(conent).css("height","400px")

    }
}


//按下退格键在查询值
document.onkeydown =()=> {
    retreat(arry,".ul_shop",".query_name")
}
//按下搜索键在查询
$(".query_name").on('keyup',function(){
    SelectData(arry,".ul_shop",".query_name")
})