选择JavaScript中的子项，因为我可以'；不要使用jQuery

我使用jQuery来确定在#mainNavigation div中是否有一个属性为data val=“-1”的li。在jQuery中，这很好，但我需要在JavaScript中做同样的事情。我搞不懂的是如何在jQuery中使用选择器来深入了解它的实现方式

if($('#mainNavigation ul li ul li[data-val="-1"]')){
   $("#mainNavigation").css("padding-left" , "10px");
};

<div id="mainNavigation">
    <ul>
        <li>
            <ul>
                <li data-val="-1">Title</li>
            </ul>
        </li>
    </ul>
</div>

if（$（'main导航ul li[data val=“-1”]”）{
$（“#主导航”）.css（“左填充”、“10px”）；
};



标题

您可以使用

.querySelector（）

：

---

或者，如果您不需要对级别如此具体，那么：

if (document.querySelector('#mainNavigation li[data-val="-1"]')){
   // ...
}

---

或者不使用

查询选择器

：

if (document.querySelector('#mainNavigation ul li ul li[data-val="-1"]')){
   // ...
}

var lis = document.getElementById('mainNavigation').getElementsByTagName("li");
var found = false;
for (var i = 0; i < lis.length; i++) {
    if (lis[i].getAttribute("data-val") === "-1") {
        found = true;
        break;
    }
}

if (found) {
    // ...
}

var lis=document.getElementById（'mainNavigation'）.getElementsByTagName（“li”）；
var=false；
对于（变量i=0；i

您使用的jQuery方法无论如何都是不正确的。@aguardiencio:OP的可能重复项不是询问如何在没有

querySelectorAll的情况下进行选择

@BlueSkies，而是询问如何在纯javascript中进行选择，因此在该问题中就是答案。@BlueSkies您是对的！第三个选项对我有用，谢谢！前两个选项不是通过使用#mainNavigation使用jQuery选择器吗？@ech:不是，它们使用的是选择器API选择器。这是本机JavaScript代码，不是jQuery。这是jQuery在引擎盖下使用的。