javascript - 为什么点击我的 元素没有按预期工作？

Question

有没有一种简单的方法可以点击 li 元素？我尝试了一些 JavaScript 方法，但它们不起作用。我是 JavaScript 的新手，所以请不要评判我。

我的 HTML 代码:

<li id="n2" class="Build">
    <a class="inactive" href="newbuild.php" accesskey="2"></a>
</li>

整个HTML代码:

<ul id="navigation">
    <li id="n1" class="Ressources">
        <a class="active" href="Ressources.php" accesskey="1"></a>
    </li>
    <li id="n2" class="Build">
        <a class="inactive" href="newbuild.php" accesskey="2"></a>
    </li>
    <li id="n3" class="map">
        <a href="map.php" accesskey="3"></a>
    </li>
    <li id="n4" class="statistics">
        <a href="stat.php" accesskey="4"></a>
    </li>
    <li id="n5" class="reports">
        <a href="reports.php" accesskey="5"></a>
    </li>
</ul>

我试过的 JavaScript 代码:

document.querySelectorAll('#n2 li.Build').click(); // Not working

document.querySelector('.Build').click(); //Not Working

那么我怎样才能点击这个li(使用CSS-Class Build)元素呢？谢谢。

Answer 1

您想要的是点击 li 中的 a 元素，而不是 li 本身:

document.querySelectorAll('#n2 li.Build a')[0].click(); // This is bad, btw

// This is also bad, performance-wise: engines read from right to left,
// so the most right-hand part of the selector (key selector)
// should be more precise
document.querySelector('.Build a').click();