我想使用jQuery获得类名
如果它有id
<div class="myclass"></div>
我想使用jQuery获得类名
如果它有id
<div class="myclass"></div>
当前回答
如果您打算使用split函数来提取类名,那么您将不得不弥补可能产生意外结果的潜在格式变化。例如:
" myclass1 myclass2 ".split(' ').join(".")
生产
".myclass1..myclass2."
我认为最好使用正则表达式来匹配类名所允许的字符集。例如:
" myclass1 myclass2 ".match(/[\d\w-_]+/g);
生产
["myclass1", "myclass2"]
正则表达式可能不完整,但希望您理解我的观点。这种方法减少了格式不佳的可能性。
其他回答
如果<div>有id:
<div id="test" class="my-custom-class"></div>
...你可以试试:
var yourClass = $("#test").prop("class");
如果你的<div>只有一个类,你可以尝试:
var yourClass = $(".my-custom-class").prop("class");
当您想要检查元素是否具有特定的类时,最好使用. hasclass()。这是因为当一个元素有多个类时,检查起来并不简单。
例子:
<div id='test' class='main divhover'></div>
地点:
$('#test').attr('class'); // returns `main divhover`.
使用. hasclass()我们可以测试div是否具有类divhover。
$('#test').hasClass('divhover'); // returns true
$('#test').hasClass('main'); // returns true
<div id="elem" class="className"></div>
使用Javascript
document.getElementById('elem').className;
与jQuery
$('#elem').attr('class');
OR
$('#elem').get(0).className;
如果我们有一个代码:
<div id="myDiv" class="myClass myClass2"></div>
使用jQuery来获取类名,我们可以定义并使用一个简单的插件方法:
$.fn.class = function(){
return Array.prototype.slice.call( $(this)[0].classList );
}
or
$.fn.class = function(){
return $(this).prop('class');
}
该方法的使用将是:
$('#myDiv').class();
我们必须注意到,它将返回一个类列表,不同于本机方法元素。它只返回所附类的第一个类。因为元素通常有一个以上的类附加到它,所以我建议您不要使用这个原生方法,而是使用element。类列表或上面描述的方法。
它的第一个变体将以数组的形式返回一个类列表,第二个变体将以字符串的形式返回——类名以空格分隔:
// [myClass, myClass2]
// "myClass myClass2"
另一个重要的注意事项是,这两个方法以及jQuery方法
$('div').prop('class');
如果我们使用更常见的选择器,它指向许多其他元素,则只返回jQuery对象捕获的第一个元素的类列表。在这种情况下,我们必须标记元素,我们想要得到他的类,通过使用一些索引,例如。
$('div:eq(2)').prop('class');
这也取决于您需要对这些类做什么。如果你只是想检查一个类到这个id元素的类列表中,你应该使用方法"hasClass":
if($('#myDiv').hasClass('myClass')){
// do something
}
如上面的评论所述。但是如果你需要把所有的类都作为选择器,那么使用下面的代码:
$.fn.classes = function(){
var o = $(this);
return o.prop('class')? [''].concat( o.prop('class').split(' ') ).join('.') : '';
}
var mySelector = $('#myDiv').classes();
结果将是:
// .myClass.myClass2
你可以让它动态地创建一个特定的CSS重写规则。
问候
这是为了将第二个类转化为多个类,使用成一个元素
var class_name = $('#videobuttonChange').attr('class').split(' ')[1];