How to get the middle name of a class from an element?

I am trying to figure out how to get the middle name of a class attribute of a class.

For example, having:

<div class="something fooBar"></div> 

How can I get a second class called fooBar?

I know that you can add, delete and check a specific class, but I could not find the documentation on how to get the second class in a variable.

+54
jquery class
Nov 21 '10 at 19:45
source share
6 answers

You can use split as follows:

 alert($('#divID').attr('class').split(' ')[1]); 

To get all classes, you can do this instead:

 var classes = $('#divID').attr('class').split(' '); for(var i=0; i<classes.length; i++){ alert(classes[i]); } 

Additional Information:

+96
Nov 21 '10 at 19:48
source share

Here's how you do it, referencing the div id

 $(document).ready( function () { alert($('#yourDivID').attr('class').split(' ')[1]); }); 

The split function allows you to split the string with the specified delimiter. This will return an array of your shared values. In this case, an array of class names will be returned.

Link to separate other string methods http://www.javascriptkit.com/javatutors/string4.shtml

You should look at the following jQuery Selectors and Functions to access classes.

Selectors

http://api.jquery.com/class-selector/ select the dom element with the specified class

http://api.jquery.com/has-selector/ select the dom element that has the specified selector

Functions

http://api.jquery.com/addClass/ method for adding a class to a jQuery object

http://api.jquery.com/removeClass/ method for deleting a class in a jQuery object

http://api.jquery.com/toggleClass/ method for switching a class to a jQuery object

http://api.jquery.com/hasClass/ method to check if a jQuery object has a specified class

http://api.jquery.com/attr/ method for extracting attributes of jQuery object

Edited: Nice cheat sheet alt text

+11
Nov 21 '10 at 19:48
source share
 // alerts "8" alert($('<div class="something 8"></div>').attr('class').split(' ')[1]); 
+9
Nov 21 '10 at 19:48
source share

as an alternative, it is always better to use data- * html attributes to track states, for example $ ("div.example"). data ("active")

+5
Dec 21 '11 at
source share

You can get the value of a class attribute and break it into a space.

 secondClass = element.className.split(' ')[1]; 
+4
Nov 21 '10 at 19:50
source share

This is not true. If classes are separated by more than one space, and you get a second class, you become empty. Example:

 <div class="something fooBar"></div> var classes = $('div').attr('class').split(' '); alert('classes: ' + classes + '; length: ' + classes.length ); // classes: something,,,fooBar; 4 

I am using the following code:

 /* * el - element * num - class number */ function getNumClass(el, num) { var classes = el.split(' '); var newclasses = []; var ret; for (var i = 0; i < classes.length; i++) { ret = $.trim(classes[i]); if(ret.length > 0) { newclasses.length += 1; newclasses[newclasses.length-1] = ret; } } if (num > newclasses.length) return false; return newclasses[num - 1]; } 
0
Jan 07 '16 at 17:13
source share



All Articles