小开

最佳答案

在通过类以外的其他方式将元素获取为jQuery对象后，然后

var className = $('#sidebar div:eq(14)').attr('class');

应该能行。ID使用.attr('id')。

如果你在事件处理程序或其他jQuery方法中，其中元素是没有包装器的纯DOM节点，你可以使用:

this.className // for classes, and
this.id // for IDs

两者都是标准的DOM方法，在所有浏览器中都得到了良好的支持。

小开

当您想要检查元素是否有特定的class时，最好使用.hasClass()。这是因为当一个元素有多个class时，检查起来并不简单。

例子:

<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:

<div id="test" class="my-custom-class"></div>

.．.你可以试试:

var yourClass = $("#test").prop("class");

如果你的<div>只有class，你可以尝试:

var yourClass = $(".my-custom-class").prop("class");

小开

你可以简单地用，

# EYZ0

小开

也许，你有一个类和一个子类。

  <div id='id' class='myclass mysubclass' >dfdfdfsdfds</div>

如果你使用以前的解决方案，你将有:

myclass mysubclass

所以如果你想要类选择器，执行以下操作:

var className = '.'+$('#id').attr('class').split(' ').join('.')

你会得到

.myclass.mysubclass

现在如果你想选择所有具有相同类的元素，比如上面的div:

   var brothers=$('.'+$('#id').attr('class').split(' ').join('.'))

这意味着

var brothers=$('.myclass.mysubclass')

更新2018

或可以实现与香草javascript在2行:

  const { classList } = document.querySelector('#id');
document.querySelectorAll(`.${Array.from(classList).join('.')}`);

小开

如果您打算使用split函数来提取类名，那么您将不得不弥补可能产生意外结果的潜在格式变化。例如:

" myclass1  myclass2 ".split(' ').join(".")

生产

".myclass1..myclass2."

我认为最好使用正则表达式来匹配类名所允许的字符集。例如:

" myclass1  myclass2  ".match(/[\d\w-_]+/g);

生产

["myclass1", "myclass2"]

正则表达式可能不完整，但希望您理解我的观点。这种方法减少了格式不佳的可能性。

小开

这是为了将第二个类转化为多个类，使用成一个元素

var class_name = $('#videobuttonChange').attr('class').split(' ')[1];

小开

为了完成怀特斯托克的答案(这是我找到的最好的答案)，我做了:

className = $(this).attr('class').match(/[\d\w-_]+/g);
className = '.' + className.join(' .');

因此，对于“我的class1我的class2”，结果将是”。myclass1 .myclass2”

小开

你可以通过两种方式获取类Name:

var className = $('.myclass').attr('class');

或

var className = $('.myclass').prop('class');

小开

如果你不知道类名，但你知道ID，你可以试试这个:

<div id="currentST" class="myclass"></div>

然后调用它使用:

alert($('#currentST').attr('class'));

小开

<div id="elem" class="className"></div>

使用Javascript

document.getElementById('elem').className;

与jQuery

$('#elem').attr('class');

或

$('#elem').get(0).className;

小开

如果我们有一个或我们想要第一个div元素，我们可以使用

否则我们需要该元素的id

小开

如果你想获得div的类，然后想检查是否有任何类存在，那么简单使用。

if ( $('#div-id' ).hasClass( 'classname' ) ) {
// do something...
}

如;

if ( $('body').hasClass( 'home' ) ) {
$('#menu-item-4').addClass('active');
}

小开

试一试

超文本标记语言

<div class="class_area-1">
area 1
</div>


<div class="class_area-2">
area 2
</div>


<div class="class_area-3">
area 3
</div>

jQuery

<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script type="application/javascript">
$('div').click(function(){
alert($(this).attr('class'));
});
</script>

小开

在javascript或jquery中获取类名的最佳方法

attr()属性函数用于获取和设置属性。

# EYZ0

jQuery('your selector').attr('class');  // Return class

检查类是否存在

The hasClass() method checks if any of the selected elements have a specified class name.


if(jQuery('selector').hasClass('abc-class')){
// Yes Exist
}else{
// NOt exists
}

设置类

jQuery('your selector').attr('class','myclass');  // It will add class to your selector

使用jQuery点击按钮获取类

jQuery(document).on('click','button',function(){
var myclass = jQuery('#selector').attr('class');
});

如果选择器没有任何类使用jQuery添加类

if ( $('#div-id' ).hasClass( 'classname' ) ) {
// Add your code
}

使用into元素将第二个类转换为多个类

Change array position in place of [1] to get particular class.


var mysecondclass = $('#mydiv').attr('class').split(' ')[1];

小开

如果我们有一个代码:

<div id="myDiv" class="myClass myClass2"></div>

使用jQuery来获取类名，我们可以定义并使用一个简单的插件方法:

$.fn.class = function(){
return Array.prototype.slice.call( $(this)[0].classList );
}

或

 $.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重写规则。

问候

小开

像这样使用:-

$(".myclass").css("color","red");

如果您使用过这个类不止一次，那么请使用每个操作符

$(".myclass").each(function (index, value) {
//do you code
}

小开

这也有用。

const $el = $(".myclass");
const className = $el[0].className;

小开

直接的方式

myid.className

console.log( myid.className )

<div id="myid" class="myclass"></div>

使用jQuery获取类名

更新2018

直接的方式