Я хочу отримати ім'я класу за допомогою jQuery

І якщо він має ідентифікатор

<div class="myclass"></div>

Після отримання елемента як об'єкта jQuery за допомогою інших засобів, ніж його клас, тоді

var className = $('#sidebar div:eq(14)').attr('class');

повинен зробити трюк. Для використання ідентифікатора .attr('id').

Якщо ви знаходитесь в обробці подій або іншому методі jQuery, де елементом є чистий вузол DOM без обгортки, ви можете використовувати:

this.className // for classes, and
this.id // for IDs

Обидва є стандартними методами DOM і добре підтримуються у всіх браузерах.

Краще використовувати, .hasClass()коли ви хочете перевірити, чи є елемент певним class. Це тому, що коли елемент має кількаclass це не тривіально перевіряти.

Приклад:

<div id='test' class='main divhover'></div>

Де:

$('#test').attr('class');        // returns `main divhover`.

З .hasClass()ми можемо перевірити , якщо divє клас divhover.

$('#test').hasClass('divhover'); // returns true
$('#test').hasClass('main');     // returns true

Будьте обережні, можливо, у вас є клас і підклас.

  <div id='id' class='myclass mysubclass' >dfdfdfsdfds</div>

Якщо ви використовуєте попередні рішення, у вас буде:

myclass mysubclass

Отже, якщо ви хочете мати селектор класу , зробіть наступне:

var className = '.'+$('#id').attr('class').split(' ').join('.')

і у вас буде

.myclass.mysubclass

Тепер, якщо ви хочете вибрати всі елементи, що мають той самий клас, як, наприклад, div:

   var brothers=$('.'+$('#id').attr('class').split(' ').join('.'))

це означає

var brothers=$('.myclass.mysubclass')

Оновлення 2018 року

АБО можна реалізувати за допомогою ванільного javascript у 2 рядках:

  const { classList } = document.querySelector('#id');
  document.querySelectorAll(`.${Array.from(classList).join('.')}`);

Це для отримання другого класу на кілька класів, використовуючи елемент

var class_name = $('#videobuttonChange').attr('class').split(' ')[1];

ви можете просто використовувати,

var className = $('#id').attr('class');

Якщо у вас <div>є id:

​<div id="test" class="my-custom-class"></div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

...Ви можете спробувати:

var yourClass = $("#test").prop("class");

Якщо у вас <div>є лише a class, ви можете спробувати:

var yourClass = $(".my-custom-class").prop("class");

Якщо ви збираєтеся використовувати функцію розділення для вилучення імен класів, тоді вам доведеться компенсувати потенційні зміни форматування, які можуть призвести до несподіваних результатів. Наприклад:

" myclass1  myclass2 ".split(' ').join(".")

виробляє

".myclass1..myclass2."

Я думаю, вам краще використовувати звичайний вираз, щоб відповідати набору допустимих символів для імен класів. Наприклад:

" myclass1  myclass2  ".match(/[\d\w-_]+/g);

виробляє

["myclass1", "myclass2"]

Регулярний вираз, мабуть, не повний, але, сподіваємось, ви зрозуміли мою думку. Такий підхід зменшує можливість поганого форматування.

Щоб виконати відповідь Уайтстока (що найкраще, що я знайшов), я зробив:

className = $(this).attr('class').match(/[\d\w-_]+/g);
className = '.' + className.join(' .');

Отже для "myclass1 myclass2" результатом буде ".myclass1 .myclass2"

Ім'я класу можна отримати двома способами:

var className = $('.myclass').attr('class');

АБО

var className = $('.myclass').prop('class');

<div id="elem" class="className"></div>

За допомогою Javascript

document.getElementById('elem').className;

З jQuery

$('#elem').attr('class');

АБО

$('#elem').get(0).className;

Якщо ви не знаєте назви класу, Але ви знаєте ідентифікатор, ви можете спробувати це:

<div id="currentST" class="myclass"></div>

Потім зателефонуйте за допомогою:

alert($('#currentST').attr('class'));

Якщо ви хочете отримати класи div, а потім хочете перевірити, чи існує якийсь клас, то просте використання.

if ( $('#div-id' ).hasClass( 'classname' ) ) {
    // do something...
}

наприклад;

if ( $('body').hasClass( 'home' ) ) {
    $('#menu-item-4').addClass('active');
}

Спробуй це

HTML

<div class="class_area-1">
    area 1
</div>

<div class="class_area-2">
    area 2
</div>

<div class="class_area-3">
    area 3
</div>

jQuery

<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script type="application/javascript">
    $('div').click(function(){
        alert($(this).attr('class'));
    });
</script>

якщо у нас є одиночний або ми хочемо перший divелемент, який ми можемо використовувати

$('div')[0].classNameінакше нам потрібен idелемент

Якщо у нас є код:

<div id="myDiv" class="myClass myClass2"></div> 

щоб взяти ім'я класу за допомогою jQuery, ми могли б визначити і використовувати простий метод плагіна:

$.fn.class = function(){
  return Array.prototype.slice.call( $(this)[0].classList );
}

або

 $.fn.class = function(){
   return $(this).prop('class');
 } 

Використання методу буде:

$('#myDiv').class();

Треба зауважити, що він поверне список класів на відміну від нативного методу element.className, який повертає лише перший клас доданих класів. Оскільки часто до цього елемента додається більше одного класу, я рекомендую не використовувати цей нативний метод, а element.classlist або описаний вище метод.

Перший варіант буде повертати список класів як масив, другий як рядок - назви класів, розділені пробілами:

// [myClass, myClass2]
// "myClass myClass2"

Ще одне важливе зауваження - це обидва методи, а також метод jQuery

$('div').prop('class');

повернути лише список класів першого елемента, спійманого об’єктом jQuery, якщо ми використовуємо більш поширений селектор, який вказує на багато інших елементів. У такому випадку ми маємо позначити елемент, ми хочемо отримати його класи, використовуючи якийсь індекс, наприклад

$('div:eq(2)').prop('class');

Це також залежить, що вам потрібно робити з цими заняттями. Якщо ви хочете просто перевірити наявність класу в списку класів елемента з цим ідентифікатором, вам слід просто скористатися методом "hasClass":

if($('#myDiv').hasClass('myClass')){
   // do something
}

як зазначено в коментарях вище. Але якщо вам потрібно взяти всі класи як вибір, тоді використовуйте цей код:

$.fn.classes = function(){
   var o = $(this);
   return o.prop('class')? [''].concat( o.prop('class').split(' ') ).join('.') : '';
 } 

 var mySelector = $('#myDiv').classes();

Результатом буде:

// .myClass.myClass2

і ви можете змусити його створити, наприклад, специфічне правило css для переписування, наприклад.

З повагою

Це теж працює.

const $el = $(".myclass");
const className = $el[0].className;

Найкращий спосіб отримати ім’я класу в JavaScript або jquery

attr() функція атрибута використовується для отримання та встановлення атрибута.

Отримайте клас

jQuery('your selector').attr('class');  // Return class

Перевірити наявність класу чи ні

The hasClass() method checks if any of the selected elements have a specified class name.

 if(jQuery('selector').hasClass('abc-class')){
        // Yes Exist
    }else{
        // NOt exists
    }

Установити клас

jQuery('your selector').attr('class','myclass');  // It will add class to your selector

Отримайте клас при натисканні кнопки за допомогою jQuery

jQuery(document).on('click','button',function(){
     var myclass = jQuery('#selector').attr('class');
});

Додайте клас, якщо у селекторі немає жодного класу за допомогою jQuery

if ( $('#div-id' ).hasClass( 'classname' ) ) {
        // Add your code
    }

Отримайте другий клас на кілька класів, використовуючи елемент

Change array position in place of [1] to get particular class.

var mysecondclass = $('#mydiv').attr('class').split(' ')[1];

використовувати так: -

$(".myclass").css("color","red");

якщо ви використовували цей клас не один раз, тоді використовуйте кожного оператора

$(".myclass").each(function (index, value) {
//do you code
}