Получить имя класса с помощью jQuery

Question

Я хочу получить имя класса, используя jQuery

И если у него есть идентификатор

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

Answer 1

После получения элемента в виде объекта jQuery с помощью других средств, отличных от его класса,

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

должен сделать свое дело. Для удостоверения личности используйте .attr('id').

Если вы находитесь внутри обработчика событий или другого метода jQuery, где элемент является чистым DOM-узлом без оболочки, вы можете использовать:

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

Оба являются стандартными методами DOM и хорошо поддерживаются во всех браузерах.

Answer 2

Лучше использовать .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

Answer 3

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

  <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

ИЛИ может быть реализовано с использованием vanilla javascript в 2 строки:

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

Answer 4

Это позволяет получить второй класс в несколько классов, используя элемент

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

Answer 5

Вы можете просто использовать,

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

Answer 6

Если ваш <div> имеет id:

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

... вы можете попробовать:

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

---

Если ваш <div> имеет толькоclass, вы можете попробовать:

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

Answer 7

Чтобы завершить ответ Whitestock (это лучшее, что я нашел) я сделал:

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

Так что для "myclass1 myclass2" результат будет '. Myclass1.myclass2'

Answer 8

Если вы собираетесь использовать функцию разделения для извлечения имен классов, вам придется компенсировать возможные вариации форматирования, которые могут привести к неожиданным результатам. Например:

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

производит

".myclass1..myclass2."

Я думаю, что вам лучше использовать регулярное выражение для сопоставления с набором допустимых символов для имен классов. Например:

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

1010 * производит *

["myclass1", "myclass2"]

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

Answer 9

Вы можете получить Имя класса двумя способами:

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

OR

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

Answer 10

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

с Javascript

document.getElementById('elem').className;

С помощью jQuery

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

OR

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