Question

我仍然在学习网页设计的绳索，而我很难理解一些事情是如何运作的......

我创建了一个功能来切换导航栏标题背景颜色，我发现以下内容是真的，但不确定原因：

使用：

$(".navbar.navbar-inverse".click(function() {
    $(this).toggleClass("highlight");
});

不起作用（空格btw navbar和navbar-inverse）：

$(".navbar .navbar-inverse".click(function() {
        $(this).toggleClass("highlight");
    });

同样，如果我将此功能应用于导航栏切换，则情况恰恰相反：

Works（空格btw导航栏和导航栏切换）：

$(".navbar .navbar-toggle").click(function() {
              $(".navbar-inverse").toggleClass("highlight");
          });

不起作用：

$(".navbar.navbar-toggle").click(function() {
                  $(".navbar-inverse").toggleClass("highlight");
              });

...奖金

无法使用此方法更改导航栏切换背景：

不起作用：

$(".navbar .navbar-toggle").click(function() {
              $(this).toggleClass("highlight");
          });

Answer 1

第一个引用具有类navbar和navbar-toggle的元素，第二个引用.navbar-toggle，它是.navbar的后代。这就是放置空间的原因：）

Answer 2

如this answer所示，您可以选择包含特定类（＆＃34; navbar-inverse＆＃34;）的元素（例如，名为＆＃34; navbar＆＃34;）和＆＃34; navbar.navbar逆＆＃34 ;.如果在这两者之间添加空格，则基本上意味着

选择所有具有navbar-inverse类的元素并且是导航栏的子元素

干杯