gpt4 book ai didi

javascript - 将子菜单指示器添加到 li 项目纯 JavaScript

转载 作者:行者123 更新时间:2023-11-28 20:48:16 24 4
gpt4 key购买 nike

我在 stackoverflow 上四处查看,但只找到了一种用 jQuery 做我想做的事情的方法。我找到的代码是这样的:

$("li:has(ul)").each(function(){
$(this).find(">a").addClass("hasSubmenu");
});

现在我想将其转换为纯 Javascript。所以我不需要为这段简短的代码包含 jQuery 库。

有人可以帮我把它变成 JS 代码吗?

最佳答案

我看到这里有两个答案。在现代浏览器中,您可以使用 querySelectorquerySelectorAll 方法来执行类似于 jQuery 的查询:

var ulChildrenOfLi = document.querySelectorAll('li>ul');
for (var u = 0, ulen = ulChildrenOfLi.length; u < ulen; u++) {
var liParent = ulChildrenOfLi[u].parentElement,
aChildOfLi = liParent.querySelector('li>a');
if (aChildOfLi) {
aChildOfLi.className = aChildOfLi.className.replace("hasSubmenu", '') + " hasSubmenu";
}
}

如果你必须支持 IE,你可以多写一些代码:

var lis = document.getElementsByTagName('li');
for (var i = 0, len = lis.length; i < len; i++) {
var li = lis[i],
uls = li.getElementsByTagName('ul'),
children = li.children;
if (uls.length !== 0) {
for (var c = 0, cl = children.length; c < cl; c++) {
var kid = children[c];
kid.className = kid.className.replace("hasSubmenu", '') + " hasSubmenu";
}
}
}

这是一个包含两者的 jsFiddle:http://jsfiddle.net/ppxcy/1/

关于javascript - 将子菜单指示器添加到 li 项目纯 JavaScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13056256/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com