如何獲得一個元素

Question

我的div的集合類名...

<div class='happy person'><img src='#' /></div> 
<div class='fat person'><img src='#' /></div> 
<div class='joyous person'><img src='#' /></div> 
<div class='grotesque person'><img src='#' /></div> 
<div class='sad person'><img src='#' /></div> 

，我已經選擇使用...

var people = $('.person') 

結果存儲在一個類變量。 jQuery將此選擇的結果作爲HTMLDivElements數組存儲 - 它們是。

後來，我想能夠看看這個數組，並針對每個元素的類做出一些決定。我已經閱讀了一個可能的解決方案;但是因爲我沒有直接處理jQuery對象，所以失敗了。如何在數組中獲得這些div的類名？使用純JavaScript

Answer 1

這應該工作：

var people = $('.person'); 
$.each(people, function(index, el) { 
    var _this = $(el); 
    if (_this.hasClass('happy')) { 
     alert('Happy!'); 
    } else if (_this.hasClass('fat')) { 
     alert('Fat!'); 
    } 
}); 

Answer 2

循環通過他們：

for (var i = 0; i < people.length; i++) 
{ 
    var class = people[i].attr('class'); 
} 

或者使用jQuery：

people.each(function() 
{ 
    var class = $(this).attr('class'); 
}); 

你知道有個類fat person不具有類fat person？它繼承了fat和person的CSS屬性。如果您需要這樣的班級名稱，請使用下劃線：fat_person。

Answer 3

要獲得單個div上的所有類，請使用.attr函數。

var classes = myDiv.attr('class'); 

這將返回元素上所有類的空格分隔列表。

如果要檢查是否存在特定的類，請使用.hasClass()。

var hasJoy = myDiv.hasClass('joyous'); 

Answer 4

我不知道你所說的「我不是一個jQuery對象直接打交道」的意思，作爲$('.person')返回一個jQuery對象，圍繞元素的數組包裹。

要獲取元素的類，只需在jQuery對象上使用.attr('class')即可。用.map()結合這一點，你只能創建每個元素的類名稱的數組：

var classes = $('.person').map(function() { 
    return $(this).attr('class'); 
}).get(); 

這將產生以下數組：

['happy person', 'fat person', ..., 'sad person'] 

Answer 5

正如摘自：http://bytes.com/topic/javascript/answers/91636-getting-class-name-string，這可能是值得嘗試，如果你不使用jQuery。

function getClassName(obj) { 
    if (typeof obj != "object" || obj === null) return false; 
    return /(\w+)\(/.exec(obj.constructor.toString())[1]; 
} 

Answer 6

div_attrs = node.attributes; 
div_class = div_attrs.getNamedItem("class").value;