jQuery 如何从元素中获取第二个类名？

How to get the second class name from element?

提问by CyberJunkie

I'm trying to find out how to retrieve the second class name of a class attribute.

我试图找出如何检索类属性的第二个类名。

For example, having:

例如，具有：

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

How can I get the second class named "fooBar" ?

如何获得名为“fooBar”的第二个类？

^{I know you can add, remove, and check a specific class but I couldn't find documentation how to retrieve a second class into a variable.}

^{我知道您可以添加、删除和检查特定的类，但我找不到如何将第二个类检索到变量中的文档。}

回答by Sarfraz

You can use splitlike this:

你可以这样使用split：

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]);
}

More Info:

更多信息：

• http://www.w3schools.com/jsref/jsref_split.asp

• http://www.w3schools.com/jsref/jsref_split.asp

回答by Matt Ball

// alerts "8"
alert($('<div class="something 8"></div>').attr('class').split(' ')[1]);

回答by John Hartsock

This is how you would do it by referencing a div ID

这是通过引用 div ID 来实现的方法

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

The split function will allow you to split a string with the specified delimiter. This will return an array of your separated values. In this case will return an array of classnames.

split 函数将允许您使用指定的分隔符拆分字符串。这将返回一个分隔值的数组。在这种情况下，将返回一个类名数组。

Reference for split an other string methods http://www.javascriptkit.com/javatutors/string4.shtml

拆分其他字符串方法的参考http://www.javascriptkit.com/javatutors/string4.shtml

You should look into the following jQuery Selectors and Functions for accessing classes

您应该查看以下用于访问类的 jQuery 选择器和函数

Selectors

选择器

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

http://api.jquery.com/class-selector/选择指定类的dom元素

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

http://api.jquery.com/has-selector/选择具有指定选择器的dom元素

Functions

职能

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

http://api.jquery.com/addClass/向 jQuery 对象添加类的方法

http://api.jquery.com/removeClass/method to remove a class to a jQuery object

http://api.jquery.com/removeClass/将类移除到 jQuery 对象的方法

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

http://api.jquery.com/toggleClass/将类切换为 jQuery 对象的方法

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

http://api.jquery.com/hasClass/检查 jQuery 对象是否具有指定类的方法

http://api.jquery.com/attr/method to retreive attributes of a jQuery object

http://api.jquery.com/attr/检索 jQuery 对象属性的方法

Edited: Nice cheat sheet

编辑： 不错的备忘单

回答by Yehia A.Salam

as an alternative, it's always better practice to use the data-* html attributes to keep track of states, e.g $("div.example").data("active")

作为替代方案，使用 data-* html 属性来跟踪状态总是更好的做法，例如 $("div.example").data("active")

回答by Christoffer Klang

You can get the value of the class attribute and split it on space.

您可以获取 class 属性的值并在空间上对其进行拆分。

secondClass = element.className.split(' ')[1];

回答by skeef

This is not correct. If classes separated more than one space and you have get second class you get empty. Example:

这是不正确的。如果班级分隔了多个空格并且您获得了第二个班级，则您将获得空位。例子：

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

I use the next 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];
}

回答by Bala Singh

You can use your spilt like

你可以使用你的溢出像

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

Then you can do this

然后你可以这样做

 var classes = $('#divID').attr('class').split(' ');

for(var i=0; i<classes.length; i++){
  alert(classes[i]);
}

Source javascript split string

源javascript 拆分字符串