如何找到一个带有类名的部分的div并获得该类名的剩余部分？

我的页面上有几个div，其中包含类my_widget-2 ， my_widget-8等。我可以使用哪些JavaScript或jQuery代码来获取数字“2”（即附加第一个匹配小部件的数字）？

注意：如果我再次写这个问题，我会更改这些类名的顺序，并要求获得“8”的方法，以避免给人的印象是我想要较小的数字。

Answer 1

 $( "[class*='my_widget']" ).each ( function () { var elClasses = $( this ).attr ( 'class' ).split ( ' ' ); for ( var index in elClasses ) { if ( elClasses[index].match ( /^my_widget-\d+$/ ) ) { var classNum = elClasses[index].split ( '-' )[1]; alert ( classNum ); break; } } } ); 

使用“ attributeContains ”选择器获取具有类my_widget-*所有元素，然后循环遍历元素搜索您的类的所有类。 找到后，提取数字部分。

Answer 2

这应该是诀窍：

 $("[class^='my_widget']").each(function() { var classParts = $(this).attr('class').split('-'); var number = classParts.pop(); }); 

请注意，它仅在有单一类时才有效，否则你会得到类似8 otherclass其他类的东西。

Answer 3

基本的JS方法：

 
foo
 function Element_getClassArgument(el, name) { var classes= el.className.split(' '); var prefix= name+'-'; for (var i= classes.length; i-->0;) if (classes[i].substring(0, prefix.length)==prefix) return classes[i].substring(prefix.length); return null; } Element_getClassArgument(document.getElementById('x'), 'widget'); // 2 

如果要在名称中包含空格字符或连字符，则必须引入某种编码方案，例如encodeURIComponent 。 但通常你可以在没有它的情况下逃脱。

用名字中包含$东西包装留给读者练习。 🙂

Answer 4

如果要使用类my_widget-2获取DIV元素，请使用此选择器：

 $("div.my_widget-2") 

但是如果你想要使用my_widget-Nforms的所有DIV元素，其中N是一个任意数字，试试这个：

 $("div[class]").each(function() { var matches = this.className.match(/(?:^|\s+)my_widget-(\d+)(?:\s+|$)/g); if (matches !== null) { alert(matches); } }) 

Answer 5

尝试element.attr('class').match(/my_widget-(\d+)/)[1]

它应该将列号作为字符串返回，因此只需在其上运行parseInt（）