javascript - jQuery querySelectorAll不起作用？

当您为我的导航栏键入内容时，我正在尝试创建一个简单的过滤器，我得到了以下内容，但似乎无法正常工作：

$("input[id='gameSearch']").on('keydown', function(e) {
          var input, filter, ul, li, a, i;
          input = $(this);
          filter = input.val().toUpperCase();
          div = $('#gamesDropdown');
          a = div.querySelectorAll("li a");
          for (i = 0; i < a.length; i++) {
              if (a[i].html().toUpperCase().indexOf(filter) > -1) {
                  a[i].style.display = "";
              } else {
                  a[i].style.display = "none";
              }
          }
      });

我有这样的HTML布局：

<ul id="gamesDropdown">
    <li>
        <input type="text" id="gameSearch" placeholder="Search...">
    <li>
    <li>
        <a href="#blah">Blah blah</a>
    <li>
    <li>
        <a href="#blah">Blah blah</a>
    <li>
    <li>
        <a href="#blah">Blah blah</a>
    <li>
</ul>

错误是：

Uncaught TypeError: div.querySelectorAll is not a function

是否已弃用此功能，或者我使用不正确？

最佳答案

querySelectorAll用于香草js，您可以执行以下操作：

a = div.get().querySelectorAll("li a");

然后坚持使用香草js，或者您可以

a = div.find("li a");

然后a将是一个jQuery对象，因此您可以像稍后在代码中一样执行.html()，但是它需要像：

a = div.find("li a");
a.each(function() {
    if ($(this).html().toUpperCase().indexOf(filter) > -1) {
       $(this).css('display', '');
    } else {
       $(this).css('display', 'none');
    }

})

关于javascript - jQuery querySelectorAll不起作用？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/49987974/