如何定义变量?

时间:2018-08-16 06:59:59

标签: javascript

///我一直收到typeError a,但未定义。 但是我试图在代码之上声明我的变量,但是它仍然不起作用。

  // Get input element
  let filter = document.getElementById('filter');
  // Add event listener
  filter.addEventListener('keyup', filterNames);



  function filterNames() {
    // Get value of input
    let filterValue = document.getElementById('filter').value.toUpperCase();

    // Get names ul
    let ul = document.getElementById('names');
    // Get lis from ul
    let li = ul.querySelectorAll('li.list-group-item');

    // Loop through collection-item lis
    for (let i = 0; i < li.length; i++) {

         let a = li[i].getElementsByTagName('a')[0];
        // If matched
        if (a.innerHTML.toUpperCase().indexOf(filterValue) > -1) {
            li[i].style.display = '';

        } else {
            li[i].style.display = 'none';
        }
    }

}

2 个答案:

答案 0 :(得分:0)

根据您的问题,我尝试复制相同的内容

HTML

<input type="text" id="filter" />


<ul id="names" class="list-group">
  <li class="list-group-item"><a>First item</a></li>
  <li class="list-group-item"><a>Second item</a></li>
  <li class="list-group-item"><a>Third item</a></li>
</ul>

JS:

// Get input element
  let filter = document.getElementById('filter');
  // Add event listener
  filter.addEventListener('keyup', filterNames);



  function filterNames() {
    // Get value of input
    let filterValue = document.getElementById('filter').value.toUpperCase();

    // Get names ul
    let ul = document.getElementById('names');
    // Get lis from ul
    let li = ul.querySelectorAll('li.list-group-item');

    // Loop through collection-item lis
    for (let i = 0; i < li.length; i++) {

         let a = li[i].getElementsByTagName('a')[0];
        // If matched
        if (a.innerHTML.toUpperCase().indexOf(filterValue) > -1) {
            li[i].style.display = '';

        } else {
            li[i].style.display = 'none';
        }
    }

}

如果在这一行没有抛出错误

let a = li[i].getElementsByTagName('a')[0];

因为没有

working fiddle

答案 1 :(得分:0)

最可能的原因是,您的每个a中都没有li,并且由于let a = li[i].getElementsByTagName('a')[0];而得到undefined。因此,您最好添加支票以进一步进行

for (let i = 0; i < li.length; i++) {

     let a = li[i].getElementsByTagName('a')[0];
    // If matched
    if (a && a.innerHTML.toUpperCase().indexOf(filterValue) > -1) {
        li[i].style.display = '';

    } else {
        li[i].style.display = 'none';
    }
}