[英]How to get all (distinct) class name of all child element in jQuery?
我有一个像这样的列表框
<div class="selectdiv">
<select class="mainclass" id="subcat">
<option>Select Category</option>
<option class="class1" value="val1" >VAL1 </option>
<option class="class1" value="val2" >VAL2</option>
<option class="class2" value="val3" >VAL3</option>
<option class="class2" value="val4" >VAL4</option>
<option class="class2" value="val5" >VAL5</option>
<option class="class3" value="val7" >VAL6</option>
<option class="class3" value="val8" >VAL7</option>
</select>
</div>
我想获得其所有子元素的类名(class1,class2,class3)...如果可以得到所有不同的名称,那就更好了。 到目前为止,我已经尝试了以下方法
$('#subcat').children('option')
$('#subcat option').attr('className')
在第一,它给我列出了其他参数以及类名,但是在第二,它返回未定义。
如果子元素可以具有多个类
var obj = {};
$('#subcat').children().each(function () {
$.each((this.className || '').split(/\s+/), function (i, v) {
obj[v] = true;
})
})
var classes = $.map(obj, function (val, key) {
return key == '' ? undefined : key;
})
console.log(classes)
演示: 小提琴
您可以遍历元素,然后将不同的类名放在某个数组中。
var classList = [];
$('#subcat option').each(function () {
if (this.className != "" && classList.indexOf(this.className) == -1)
classList.push(this.className);
});
看看是否要将所有类都放在数组中,然后使用:
var cls = [];
$('#subcat').find('option').each(function(){
cls.push(this.className);
});
这将输出所有的类名。
如果您想要唯一的类名,例如仅class2
:
var cls = [];
$('#subcat').find('option[class$="2"]').each(function(){
cls.push(this.className);
});
这将输出所有以2
结尾的类名。
或者,如果要获取除该class2
之外的所有类名,则:
var cls = [];
$('#subcat').find('option:not([class$="2"])').each(function(){
cls.push(this.className);
});
这将遍历每个元素,但类名以2
结尾,并将所有类名压入此处。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.