Перейти к содержимому

Как получить имя класса js

  • автор:

js получить название класса

Чтобы получить название класса в JavaScript, нужно использовать свойство className элемента или метод classList для доступа к списку классов элемента.

  1. Используя свойство className :
 class="my-class">
const element = document.querySelector('.my-class'); const className = element.className; console.log(className); // выведет "my-class" 
  1. Используя метод classList :
 class="my-class">
const element = document.querySelector('.my-class'); const classList = element.classList; console.log(classList); // выведет объект DOMTokenList console.log(classList[0]); // выведет первый класс элемента, т.е. "my-class" 

Важно учитывать, что если элемент имеет несколько классов, то возвращаемое свойством className значение будет строкой, содержащей все классы через пробел. Если же нужно работать с каждым классом отдельно, то лучше использовать метод classList , который возвращает объект DOMTokenList , содержащий все классы элемента в виде отдельных строк.

  1. Получение списка всех классов элемента:
 class="foo bar">
const element = document.querySelector('div'); const classList = element.classList; console.log(classList); // выведет DOMTokenList ["foo", "bar"] 
  1. Получение первого класса элемента:
 class="foo bar">
const element = document.querySelector('div'); const firstClass = element.classList[0]; console.log(firstClass); // выведет "foo" 

Получить имя класса элемента с помощью JavaScript/jQuery

В этом посте мы обсудим, как получить имя класса элемента в JavaScript и jQuery.

1. Использование jQuery

Простое и довольно эффективное решение для получения значения атрибута класса элемента заключается в использовании jQuery. .attr() метод. Этот метод продемонстрирован ниже:

jQuery

$ ( document ) . ready ( function ( ) < var className = $ ( '#container' ) . attr ( 'class' ) ; alert ( className ) ;

HTML

CSS

font : 15px ‘Exo 2’ , sans-serif ;

Кроме того, вы можете получить прямой доступ к className свойство, которое представляет содержимое атрибута класса элемента.

jQuery

$ ( document ) . ready ( function ( ) < var className = $ ( '#container' ) [ 0 ] . className ; alert ( className ) ;

HTML

CSS

font : 15px ‘Exo 2’ , sans-serif ;

2. Использование JavaScript

В простом JavaScript вы можете получить значение атрибута класса указанного элемента с помощью className свойство, как показано ниже:

JS

var className = document . getElementById ( ‘container’ ) . className ;
alert ( className ) ;

HTML

CSS

font : 15px ‘Exo 2’ , sans-serif ;

В качестве альтернативы вы можете использовать querySelector() метод, как показано ниже.

JS

const < className >= document . querySelector ( ‘#container’ ) ;
alert ( className ) ;

HTML

CSS

font : 15px ‘Exo 2’ , sans-serif ;

Вот и все, что касается получения имени класса элемента в JavaScript и jQuery.

Оценить этот пост

Средний рейтинг 5 /5. Подсчет голосов: 21

Голосов пока нет! Будьте первым, кто оценит этот пост.

Сожалеем, что этот пост не оказался для вас полезным!

Расскажите, как мы можем улучшить этот пост?

Спасибо за чтение.

Пожалуйста, используйте наш онлайн-компилятор размещать код в комментариях, используя C, C++, Java, Python, JavaScript, C#, PHP и многие другие популярные языки программирования.

Как мы? Порекомендуйте нас своим друзьям и помогите нам расти. Удачного кодирования 🙂

Подписывайся
0 Комментарии
Встроенные отзывы
Просмотреть все комментарии
Загрузить больше комментариев
Просматривать
Подпишитесь на новые публикации

Techie Delight © 2023 Все права защищены.

Этот веб-сайт использует файлы cookie. Используя этот сайт, вы соглашаетесь с использованием файлов cookie, нашей политикой, условиями авторского права и другими условиями. Читайте наши Политика конфиденциальности. Понятно

Как получить имя класса js

var obj = new SomeClass();

как получить строчку «SomeClass» из obj?
именно не проверить, является ли obj объектом класса SomeClass, а получить имя.
Ведь бывает, передаются функции параметры, и ты просто по пропертям пробегаешься, например иногда хочется распечать еще и тип объекта.

Re: Как получить имя класса из объекта?

От: Роман Дубров Я@Blogspot
Дата: 04.06.10 11:13
Оценка:

А>именно не проверить, является ли obj объектом класса SomeClass, а получить имя.

get_class
(PHP 4, PHP 5)

get_class — Returns the name of the class of an object

Re: Как получить имя класса из объекта?

От: Панда
Дата: 04.06.10 12:18
Оценка:

Здравствуйте, Аноним, Вы писали:

А>var obj = new SomeClass();
А>как получить строчку «SomeClass» из obj?

Re[2]: Как получить имя класса из объекта?

От: Аноним
Дата: 06.06.10 02:19
Оценка:

Здравствуйте, Роман Дубров, Вы писали:

А>>именно не проверить, является ли obj объектом класса SomeClass, а получить имя.

РД>get_class
РД>(PHP 4, PHP 5)

РД>get_class — Returns the name of the class of an object

Прошу прощения, я подразумевал JavaScript, не знал, что уних похож синтаксис

Re[3]: Как получить имя класса из объекта?

От: c-smile http://terrainformatica.com
Дата: 06.06.10 07:13
Оценка:

Здравствуйте, Аноним, Вы писали:

А>Здравствуйте, Роман Дубров, Вы писали:

А>>>именно не проверить, является ли obj объектом класса SomeClass, а получить имя.

А>Прошу прощения, я подразумевал JavaScript, не знал, что уних похож синтаксис

А в JavaScript нет классов. Есть функции.

Re: Как получить имя класса из объекта?

От: c-smile http://terrainformatica.com
Дата: 06.06.10 07:16
Оценка: 6 (1)

Здравствуйте, Аноним, Вы писали:

А>Добрый день,

А>Есть:

А>var obj = new SomeClass();

А>как получить строчку «SomeClass» из obj?

Функция создавшая объект доступна через obj.constructor свойство.

Поэтому имя достаем так: obj.constructor.name

Но обрати внимание на это:

function A() < this.one = 1; >var B = A; var b = new B(); alert(b.constructor.name);

JavaScript свойство Element.className

JavaScript свойство className объекта Element задает значение атрибута class, или возвращает строковое значение этого атрибута, содержащее класс, или классы текущего элемента, разделенные пробелами.

Обращаю Ваше внимание на то, что использование свойства classList является удобной альтернативой доступа к списку классов элемента.

Поддержка браузерами

Свойство Chrome

Firefox Opera Safari IExplorer Edge
className Да Да Да Да Да Да

JavaScript синтаксис:

// получение классов элемента const className = element.className; // установка классов элемента element.className = someClassName

Версия JavaScript

Document Object Model (DOM) Level 1

Пример использования

// инициализируем переменные const elem = document.getElementsById("myElem"); // находим определенный элемент по id if ( elem.className === "active" )  // проверяем имеет ли элемент определенный класс elem.className nam">inactive"; // устанавливаем класс элементу > else  elem.className nam">active" // устанавливаем класс элементу > 

© 2016-2023 Денис Большаков, замечания и предложения по работе сайта Вы можете направить по адресу basicweb.ru@gmail.com

Кажется, вы используете блокировщик рекламы 🙁

Этот ресурс не является коммерческим проектом и развивается на энтузиазме автора сайта, который посвящает все свое свободное время этому проекту.

Добавьте, пожалуйста, basicweb.ru в исключения блокировщика рекламы, этим вы поможете развитию проекта.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *