Javascript 使用jQuery添加类，但确保它使用类后面的所有标记

我不知道如何在标题中使用这个词，但让我们假设您有这样的设置：

    <script type="text/javascript">

    $(document).ready(function(){
        $('#tabp1').show();
        $('#tabp2').hide();
        $('#tabp3').hide();
        $('#tab1').addClass("activeTab");
        $('#tab1').css("activeTab");
    })

    function tab1(){
        $('#tabp1').show();
        $('#tabp2').hide();
        $('#tabp3').hide();
        $('#tab1').addClass("activeTab"); // add class activeTab to show active
        $('#tab2').removeClass("activeTab"); // remove the class from the pre selected ones
        $('#tab3').removeClass("activeTab"); // remove the class from the pre selected ones
    }
    function tab2(){
        $('#tabp2').show();
        $('#tabp1').hide();
        $('#tabp3').hide();
        $('#tab1').removeClass("activeTab"); // remove the class from the pre selected ones
        $('#tab2').addClass("activeTab"); // add class activeTab to show active
        $('#tab3').removeClass("activeTab"); // remove the class from the pre selected ones
    }
    function tab3(){
        $('#tabp1').hide();
        $('#tabp3').show();
        $('#tabp2').hide();
        $('#tab1').removeClass("activeTab"); // remove the class from the pre selected ones
        $('#tab2').removeClass("activeTab"); // remove the class from the pre selected ones
        $('#tab3').addClass("activeTab"); // add class activeTab to show active
    }

</script>

我需要javascript不仅选择：

#内容左侧#主左侧内容#表选项卡ul li.activeTab

而且：

#内容左侧#主左侧内容#表选项卡ul li.activeTab a

这应该是可能的，有什么想法吗

我想在此澄清一下问题：

javascript正确地应用了类activeTab，但是我需要文本为白色，所以当我选择了一个（在活动选项卡之后）并将颜色更改为白色时，它不会应用它

---

有趣的改变，我已经改变了锚属性上的文本大小，它也改变了大小，所以我认为这是颜色的问题，所以，假设您选择了一个“#table tabs ul li a”：

---

你应该换个地方！重要的颜色，它会修复它

#content-left #mainLeftContent #table-tabs ul li.activeTab a{
    color: white !important;
}

---

检查此JSFIDLE

这两个选择器同样精确，这意味着将使用最后声明的选择器

#content-left #mainLeftContent #table-tabs ul li.activeTab a{
    color: white;
}

#content-left #mainLeftContent #table-tabs ul li.tab a{
    color: black;
}

您可以通过使用默认颜色进行修复，该颜色在激活时会被覆盖

/* white when active (now more precise because of li.activeTab */
#content-left #mainLeftContent #table-tabs ul li.activeTab a{
    color: white;
}
/* default black */
#content-left #mainLeftContent #table-tabs ul li a{
    color: black;
}

---

在我这方面，它在调整CSS后起作用，您不必添加所有额外的CSS引用。就这么简单吧，它在我这边工作得很好

<style type="text/css">
li.oldTab{
    /* sets background and text color */
}

li.tab a{
    color: black;
}

li.tab{
    padding: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: white;
}
li.activeTab a{
    color: white;
}

li.activeTab{
    background: #999;
}
</style>

李.奥尔德表{
/*设置背景和文本颜色*/
}
表a{
颜色：黑色；
}
li.tab{
填充：10px；
-webkit边框左上半径：10px；
-webkit边框右上角半径：10px；
-左上角moz边界半径：10px；
-moz边框半径右上角：10px；
边框左上半径：10px；
边框右上角半径：10px；
颜色：白色；
}
li.activeTab a{
颜色：白色；
}
li.activeTab{
背景：#999；
}

嗨，伙计，不知道你在问什么。显然有些东西不起作用了。您能否将问题复制到一个工作示例上，或将其指向一个工作示例，并告诉我们问题是什么？谢谢你的评论，我现在就做：）酷，完成后告诉我。：）它没有使用CSS中的jQuery，我找不到谷歌上托管的最新版本的jQ：SI已经更新了我的OP的底部：）我不知道这是否会清除它？那会去哪里？显然，不能选择选项卡作为其元素？由于ID在文档中必须是唯一的，因此该选择器的左半部分完全没有用处

/* white when active (now more precise because of li.activeTab */
#content-left #mainLeftContent #table-tabs ul li.activeTab a{
    color: white;
}
/* default black */
#content-left #mainLeftContent #table-tabs ul li a{
    color: black;
}

<style type="text/css">
li.oldTab{
    /* sets background and text color */
}

li.tab a{
    color: black;
}

li.tab{
    padding: 10px;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: white;
}
li.activeTab a{
    color: white;
}

li.activeTab{
    background: #999;
}
</style>