There is a need to create autocompet. You enter a value into input , then it compares it with the first letters of the values from the array of strings, say programming languages. The output in the div should create a list with values from the data array in which there is a match with the value entered in the input . The comparison is made by the first letters. I tried to solve this problem clumsily and directly, just to print all the values and hide the unchecked checks, and with each new character entered in the input, just run it all over the entire list. So here's how to implement an optimized lightweight algorithm for finding matches in strings, provided that you can add characters to the input or delete them. Any information would be helpful. Language - pure javascript
function visibility() { var div = doc.getElementById("myDropdown"); var input = doc.getElementById("myInput").value; if (input.length >= 1) { div.style.display = "block"; } else { div.style.display = "none"; } } function filterFunction() { var input = doc.getElementById("myInput"); var filter = input.value.toUpperCase(); var div = doc.getElementById("myDropdown"); var a = div.getElementsByTagName("a"); for (var i = 0; i < a.length; i++) { if (a[i].innerHTML.toUpperCase().indexOf(filter) == 0) { a[i].style.display = "block"; } else { a[i].style.display = "none"; } } } #myInput { background-color: #f9f9f9; outline: none; border: 2px solid #cccccc; padding: 5px; width: 300px; margin-top: 5px; font-family: "Segoe"; color: #404040; font-size: 14px; } #myInput:focus { border: 2px solid blue; } .dropdown { position: relative; display: inline-block; width: 360px; } .dropdown-content { display: block; position: absolute; min-width: 230px; height: 300px; overflow-y: hidden; overflow-x: hidden; box-shadow: 0px 4px 4px 4px rgba(0, 0, 0, 0.2); z-index: 1; width: 360px; display: none; } .dropdown-content a { color: black; width: 400px; padding: 5px 10px; height: 22px; text-decoration: none; color: #494949; cursor: pointer; z-index: 5000; } <input type="text" placeholder="Введите язык программирования" id="myInput" onkeyup="visibility(); filterFunction()" autocomplete="off"> <div id="myDropdown" class="dropdown-content"> </div> 
visibilityfunction. - user207618