///我一直收到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';
}
}
}
答案 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];
因为没有
答案 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';
}
}