Question

我目前正致力于构建互动网站的codecademy课程，我偶然发现了使用css元素的元素/类选择的模糊性。

的javascript：

var main = function() {

    $('.article').click(function() {
        $('.article').removeClass('current');
        $('.description').hide();
        $(this).addClass('current');
        $(this).children('.description').show();
    });

};

的CSS：

.current .item {
  background: rgba(206,220,206,.9);
}

为什么我必须使用元素选择器＆＃39; current＆＃39;而不是类选择器＆＃39; .current＆＃39;在第4行？它背后是否有任何规则或只是jquery的规范？

Answer 1

只是因为班级名称为current而不是.current，而且

$('.article').removeClass('current');

current不是任何选择器，只是您要移除的classname，而选择器是.article。

您认为我们正在使用元素选择器而不是类选择器。但你错了。您是否在删除类中看到“类”一词并添加类？这意味着您传递的是类选择器，而不是元素选择器作为参数。

现在你可能会问为什么你看不到当前的点？因为类是使用点指定的。实际上我们已经指定我们正在传递类选择器，因为你可以看到word＆＃34; Class＆＃34;删除类并添加类。

Answer 2

在addClass / removeClass中，您使用的是类名（就像您在html的class属性中指定的那个），而不是{{1}中的DOM选择器}}

Answer 3

函数名称removeClass（）意味着您必须声明一个类名。使用选择器，您必须指定要选择的类或ID。

Answer 4

根据文档addClass()：

将指定的类添加到每组匹配的元素中。

因此，您需要将classname / names作为参数传递，而不是通过它构建的类选择器。

Answer 5

addClass和removeClass方法接受一个或多个空格分隔的类，以从每个匹配元素的class属性中删除。要添加/删除的calss的名称是“current”，而不是“.current”

http://api.jquery.com/removeclass/
http://api.jquery.com/addclass/

Answer 6

在第4行中，您没有使用'current'作为选择器，它是一个类名。每当你使用某个类名作为选择器时（例如在.find('.current'), $('.current') , closest('.current') etc) then only the rule of putting中使用。for class name #`用于id等。每当你检查某个类存在时（.hasClass（）），添加和删除一个类（addClass（'current'），removeClass（'current'），那么你必须提到正确的类名。我希望它有所帮助。

何时在javascript中使用css元素/类选择器？

6 个答案: