无法使用 Jquery.contains() 检查 <li> 中的嵌套 <ul>

Question

主要问题 | $.contains(arg1, arg2)

我无法让$.contains() 工作。
我想检查<li> 是否有嵌套的<ul class="sub-menu">，但无论我将参数放入什么格式，我总是得到false 的输出。 （希望最终将其包装在 if 语句中以编辑一些 CSS）

更多信息如下

JS

$( document ).ready(navSecondary());
function navSecondary(){
  var firstListSize = $("nav.header-secondary>ul>li").length;
  for (var i = 0; i < firstLiSize; i++) {
    var nav = $("nav.header-secondary>ul>li:nth-child("+i+1+")");
    var sub = document.documentElement.getElementsByTagName("ul");
    var check = $.contains(sub,nav);
    console.log(check);
  }
}

HTML

<nav class="header-secondary">
    <ul>
        <li><a href="#">item 1</a>
            <ul class="sub-menu">
                <li><a href="#">Sub Option 1</a></li>
                <li><a href="#">Sub Option 2</a></li>
                <li><a href="#">Sub Option 3</a></li>
            </ul>
        </li>
        <li><a href="#">Item 2</a></li>
        <li><a href="#">Item 3</a></li>
    </ul>
</nav>

这里我希望能够使用 Js + Jquery 有条件地编辑 css（Codepen 有基本 css）

Codepen (Just for reference :)))

一些背景

所以我在 WordPress 上创建了一个主题并想使用 WordPress 的内置菜单管理器，我不想经历让 WordPress 为每个列表项和子菜单列表创建类等等的麻烦。 .
编辑-我意识到有一种更简单的方法来做 CSS（通过 WordPress 将添加到菜单项的类），但我想尝试通过 Jquery 来做

Answer 1

试试这个：

$( document ).ready(navSecondary());
function navSecondary(){
  var list = $("nav.header-secondary>ul>li");
  for (var i = 0; i < list.length; i++) {
    var check = list[i].children.length > 1;
    console.log(check)
  }
}

使用 $("nav.header-secondary>ul>li") 获得列表后，您可以使用该列表来迭代并检查其内容:)

---

如果你特别想找ul标签

$( document ).ready(navSecondary());
function navSecondary(){
  var list = $("nav.header-secondary>ul>li");
  for (var i = 0; i < list.length; i++) {
    var check = [...list[i].children].some(c => c.tagName == "UL")
    console.log(check)
  }
}