javascript - 学习如何创建搜索菜单来过滤链接
问题描述
我正在使用 w3schools 示例,在下面的代码中,我试图了解代码上的这一行是什么意思
a = li[i].getElementsByTagName("a")[0];
并且
li[i].style.display = "";
这是完整的代码:
function myFunction() {
// Declare variables
var input, filter, ul, li, a, i;
input = document.getElementById("mySearch");
filter = input.value.toUpperCase();
ul = document.getElementById("myMenu");
li = ul.getElementsByTagName("li");
// Loop through all list items, and hide those who don't match the search query
for (i = 0; i < li.length; i++) {
a = li[i].getElementsByTagName("a")[0];
if (a.innerHTML.toUpperCase().indexOf(filter) > -1) {
li[i].style.display = "";
} else {
li[i].style.display = "none";
}
}
}
解决方案
a = li[i].getElementsByTagName("a")[0];
获取当前迭代<a>
中元素的第一个标签。<li>
li[i].style.display = "";
清除当前迭代display
中元素的样式属性。<li>
推荐阅读
- r - 来自存储在变量 R 中的文本的绘图标签中的上标
- javascript - 无法设置 cookie 的过期日期
- python - 线性回归的单一预测
- mysql - 如何使用 Nodejs 将 Angular 2 与 MySql 数据库连接起来?
- c++ - 为编译器设置 libstdc++.so.6 位置
- apache-spark - Spark RDD对简单集合的递归操作
- python - python 2.7给出结果后如何结束程序
- html - 当使用 Flexbox 的容器中没有足够的空间时,我可以让两个 html 输入进入它们自己的行吗?
- javascript - 提高 Cube Portfolio Gallery 中的图像加载速度
- javascript - socket.io 客户端连接到服务器但不通信