下拉框匹配

写代码用原生JS实现一个类似百度搜索框的自动完成控件，比如候选结果集arr=['aaa', 'abc', 'acc', 'dda',…]; 用户输入'a',下拉列表会出现以字母a开头的项'aaa', 'abc', 'acc'。要求，鼠标或键盘可以选中候选结果到输入框

<body>
 <input type="text" name="" id="" >
 <div>
     <ul>
     </ul>
 </div>
    
</body>
<script>
    var input=document.querySelector('input');//获取input框
    var ul=document.querySelector('ul');//获取ul
    arr=['aaa', 'abc', 'acc', 'dda']; 
    //给input加一个点击事件
    input.onblur=function(){
        ul.innerHTML='';//清空ul
        for(var i=0;i<arr.length;i++){
            //查找从首字母开始的字符是否与输入的值相等
            if(arr[i].indexOf(input.value)===0){
                //如果相等就在li里面创建出下拉列表，
                var li=document.createElement('li');
                li.innerText=arr[i];
                ul.appendChild(li);
                //给li绑定一个点击事件
                li.onclick=function(){
                    //清空ul 将值写入input框
                    ul.innerHTML='';
                    input.value=li.innerText;
                }
            }

        }
    }
 </script>

7.下拉框匹配

下拉框匹配