通过链接querySelector来选择元素的jQuery替代方法[重复]

Question

给定以下 html：

<div class="container">
    <form class="form" id="login">
        <h1 class="form__title">Login</h1>
        <div class="form__message form__message-error"></div>
    </form>
</div>

有没有一种简单的方法来引用“form__message”类的元素？我知道这是这个例子中这个类的唯一元素，但可能还有更多。所以我尝试以下方法来删除 form__message-error CSS-properties：

 $("#login .form__message").classList.add("form__message--error");

然而，这并没有找到正确的元素，而以下工作：

document.querySelector("#login").querySelector(".form__message").classList.remove("form__message--error");

我正在寻找最后一条语句的 jQuery 替代方案。

Answer 1

您正在混合使用 jQuery 和 DOM 方法。 .classList.add() 的 jQuery 等效项是 .addClass()。

$("#login .form__message").addClass("form__message--error");

你不需要.find()和querySelector()，你可以使用与jQuery相同的选择器：

document.querySelector("#login .form__message").classList.add("form__message--error");