代码之家 › 专栏 › 技术社区 › Nisarg Atul Waghmare

如何选择具有特定类的元素?[复制]

custom-data-attribute html5 jquery javascript

-1

Nisarg Atul Waghmare · 技术社区 · 7 年前

current 类,无论哪个数据属性选项卡具有类并添加 现在的 类到下面类似的ID div 具有 tab-content

<a class="projects_select tab-link" data-tab="tab-1" href="#tab1"> tab1 </a>
<a class="projects_select tab-link current" data-tab="tab-2" href="#tab2"> tab2 </a>
<a class="projects_select tab-link" data-tab="tab-3" href="#maps"> tab3 </a>

我有以下人 div's 选项卡内容 班级。

<div class="tab-content" id="tab-1">Tab-1 </div>
<div class="tab-content" id="tab-2">Tab-2 </div>
<div class="tab-content" id="tab-3">Tab-3 </div>

尝试:

$(document).ready(function($) { 
    $('.projects_select').find('current').attr(data-tab);
    $('.tab-content').addClass('current');
});

1 回复 | 直到 7 年前

1

isherwood 7 年前

基本答案是简单的组合类选择器,您需要将其分配给一个变量:

var myId = $('.projects_select.current').attr(data-tab);

然后,使用该元素选择一个伴生元素:

$('#' + myId).addClass('current');

不过,我建议简化使用顺序(索引):

var myIndex = $('.projects_select.current').index();

然后。。。

$('.tab-content').eq(myIndex).addClass('current');

这就消除了对id和数据属性的需求。如果你有更多的实例 .tab-content 一个包含两个元素的页面上的元素:

$('.parent-element .tab-content').eq(myIndex).addClass('current');

https://api.jquery.com/eq/