我的 javascript 更改了 innerHTML,但拒绝为其添加延迟。我的目标是制作一个将列表项紧接着移动的菜单,但这仅适用于前两个列表项。我使用了 innerHTML,所以我可以看看它是否触及它们。我不确定什么不起作用。我做了 x[0]、x[1].. 等等,它起作用了。还有另一个问题 :D,如何选择某个 ID 中带有 TagName 的所有元素?
JS:
var x = document.getElementsByTagName("LI");
var delay = 0;
for (i=0; i<=x.length; i++){
x[i].style.padding = "0 0 0px 20px";
x[i].style.transition = "1s " + delay +"s !important"
x[i].innerHTML = "Changed";
delay += "0.1";
}
HTML:
<header class = "mainHeader">
<nav>
<ul id = "mainNav">
<li id = "search"><img src = "img.png"><input type = "text" placeHolder = "" id = "search"></li>
<li><a href ="#">HOME</a></li>
<li><a href ="#">ABOUT</a></li>
<li><a href = "#">PHOTOGRAPHY</a></li>
<li><a href ="#">PROJECTS</a></li>
<li><a href ="#">CONTACT</a></li>
</ul>
</nav>
</header>`
最佳答案
尝试
delay = delay + 0.1;
不使用 ""因为这使它成为一个字符串,因此它不会表现为数字并将数字递增 0.1,它将开始变为 00.10.10.10.1 等
回答
How can I select all elements with TagName in a certain ID?
使用 JQuery:
$('tagname#some_id')
或
$('tagname[id="some_id"]')
关于Javascript循环拒绝执行功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25067635/