Те же действия на тот же идентификатор, как упростить?

Question

Я пытаюсь сделать что-то подобное, я чувствую, что это можно упростить, как я могу это сделать?

$('#specificId').find('.class1').addClass('classA');
$('#specificId').find('.class2').addClass('classB');
$('#specificId').find('.class3').addClass('classC');

Можно ли сократить это до

$('#specificId').find('.class1, .class2, .class3').addClass('classA, classB, classC');

Answer 1

Вы не можете сделать это за одну операцию.Однако вы можете сделать это в цикле над свойствами объекта:

var obj = {
  class1: 'classA',
  class2: 'classB',
  class3: 'classC'
}

var $el = $('#specificId');
$.each(obj, function(key, value) {
  $el.find(`.${key}`).addClass(value);
});

Это не обязательно более просто, но, безусловно, более расширяемо.

Answer 2

Я пойду для данных - * атрибут:

$('#container').find('.class1, .class2, .class3').each(function(){
  $(this).addClass($(this).data('class'));
});

.classA{
  color: red;
}
.classB{
  color: green;
}
.classC{
  color: blue;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
  <div class="class1" data-class="classA">class1</div> 
  <div class="class2" data-class="classB">class2</div> 
  <div class="class3" data-class="classC">class3</div> 
</div>