如何将带有Javascript的类添加到自动生成的Joomla菜单子项'；李'；在特定部门内？

我正在为Joomla 4使用Bootstrap 4开发一个模板。在mod_菜单php文件中定义了不同级别（父级、子级、深层等）的主菜单结构。我在两个位置放置了相同的（主站点）菜单：一个用于移动设备（#sidenav），另一个用于桌面视图（#主菜单）

子级的li项充当菜单中下一级的分隔符/标题（例如，项“更多信息”，但不是“顶级项”），从mod_menu/default_separator.php文件应用class.dropdown子菜单

sidenav显示如我所愿（参见图：），但在主菜单div（即桌面/大型平板电脑视图）中，我希望第二级和任何以下级别的下拉列表为“dropright”

当我使用Firefox inspector添加类时，它工作得非常好，因此为了自动实现这一点，我需要使用Javascript添加一个类来更改它：

    <li class="dropdown-submenu">

及

或

我昨天一整天都在网上搜索答案，并尝试了许多其他组合，但都没有结果。Javascript绝对不是我的堡垒，因此我非常感谢您的帮助。

我找到了答案：

window.onload = function(){dropRight()};
function dropRight() {
    var x = document.getElementById("mainmenu").querySelectorAll("li.dropdown-submenu");
x[0].className += " dropright";
}

我找到了答案：

window.onload = function(){dropRight()};
function dropRight() {
    var x = document.getElementById("mainmenu").querySelectorAll("li.dropdown-submenu");
x[0].className += " dropright";
}

---

Joomla附带了jquery加载，您能不能不简单地使用

$（“#main menu.dropdown submenu”）.addClass（“dropright”）？我听说在未来的某个阶段，Joomla-可能是J4x-将删除jquery（可能是因为它负载很重，而使用的是香草es6 JS），所以我使用香草javascript来先发制人。好吧，很公平。Joomla附带了jquery加载，你能不能简单地使用
$（“#main menu.dropdown submenu”）.addClass(“dropright”）；
？我听说在未来的某个阶段，Joomla-可能是J4x-将删除jquery（可能是因为它负载太重，而使用的是香草es6 JS），所以我使用香草javascript先发制人。好吧，很公平。你现在可以接受自己的答案了。（建议您向那些可能不理解您的解决方案的人解释您的解决方案。）您现在可以接受自己的答案。（建议您向那些可能不理解您的解决方案的人解释您的解决方案。）
    function dropRight() {
    var element = document.getElementById('mainmenu');
    var ul = document.getElementsByClassName("dropdown-menu");
    var li = ul[0].getElementsByClassName("dropdown-submenu"); 
    for ( var i = 0; i < li.length; i++ ){
    var class = li[i].className += " dropright";
}

    function dropRight() {
    var elements = document.getElementsByClassName('dropdown-submenu');
    elements[0].className += " dropright";
    }

    function dropRight() {
    var elements = document.getElementsByClassName('.dropdown-submenu');
    elements.classList.add("dropright");
}

window.onload = function(){dropRight()};
function dropRight() {
    var x = document.getElementById("mainmenu").querySelectorAll("li.dropdown-submenu");
x[0].className += " dropright";
}