如何 - 在纯 javascript 中过滤/搜索表

Question

Search table using pure javascript. I had tried below function. What's wrong in this function?

 function myFunction() { var input, filter, table, tr, td, i, txtValue; input = document.getElementById("myInput"); filter = input.value.toUpperCase(); table = document.getElementById("myTable"); tr = table.getElementsByTagName("tr"); for (i = 0; i < tr.length; i++) { td = tr[i].getElementsByTagName("td")[0]; if (td) { txtValue = td.textContent || td.innerText; if (txtValue.toUpperCase().indexOf(filter) > -1) { tr[i].style.display = ""; }else{ tr[i].style.display = "none"; } } } }

Answer 1

I don't see a problem your code seems to work

 function myFunction() { var input, filter, table, tr, td, i, txtValue; input = document.getElementById("myInput"); //filter = input.value.toUpperCase(); filter = '1' table = document.getElementById("myTable"); tr = table.getElementsByTagName("tr"); for (i = 0; i < tr.length; i++) { td = tr[i].getElementsByTagName("td")[0]; if (td) { txtValue = td.textContent || td.innerText; if (txtValue.toUpperCase().indexOf(filter) > -1) { tr[i].style.display = ""; } else { tr[i].style.display = "none"; } } } } setTimeout(myFunction, 1000)

 <table id="myTable"> <tr> <td>1</td> <td>2</td> </tr> <tr> <td>11</td> <td>33</td> </tr> <tr> <td>2</td> <td>2</td> </tr> <tr> <td>3</td> <td>4</td> </tr> <tr> <td>3</td> <td>5</td> </tr> </table>