Question

我有一个随机数量的元素（可以是div，header等）和特定的类。我需要将该课程分成最多4个单词，但我无法得到任何结果。

我想让人们自定义此插件。第一个数字是列数，第二个数字是重置此插件所需的最大宽度

我用这种方式编码：

// HTML

<!--
X stands for the foo number
Y stands for the boo number
-->

<div class="foo-X-boo-Y></div>
<div class="foo-X-boo-Y></div>
<div class="foo-X></div>

<!--and many other elements-->

// JS

$( document ).ready(function() {
    $( '[class*=boo-]' ).each(function() {
        var boo = $( this );
        var n = parseInt( boo.attr( 'class' ).match( /boo-(.*)/ )[1] );
        var booReset = boo.attr( 'class' ).match( /foo/ );
        var numb = boo.attr( 'class' ).match( /foo-(.*)/ );
    });
});

变量n返回X数。变量booReset返回[“foo”]或null值。变量numb返回[“foo-Y”，“Y”]，我只需要Y号。

我需要解析Y整数。

我尝试做与n变量相同的事情，但控制台返回“TypeError：boo.attr（...）。match（...）为null”。为什么呢？

我尝试过其他方式：

/。？＆lt; = reset /返回null /(.//em>$)?<=reset/返回null

我所做的一切都是空的！

有没有办法根据连字符划分类名？

FOO-X-BOO-Y

应该是

foo，x，boo，y

然后使用这四个变量？

这里是整个JS的小提琴 http://jsfiddle.net/dcdeiv/yAn5K/3/

Answer 1

怎么样：用-字符拆分类名并过滤掉任何非数字值。

像这样：

$( '[class*=boo-]' ).each(function() {
      var boo = $( this );
      var className = boo.attr("class");
      var numbersInClassName = $.grep(className.split("-"),function(item){ 
          var num = parseInt(item);
          return !isNaN(item);
      });
      console.log(className + ": " + numbersInClassName);
});

以下是对原始小提琴的修改：http://jsfiddle.net/yAn5K/7/

Answer 2

据我所知，你想要解析X和Y数字，并根据它们做一些逻辑。如果是这样，那么你需要进行字符串拆分：

var tokens = "foo-1-boo-2".split("-");
// => ["foo", "1", "boo", "2"]

var tokens = "foo-42".split("-");
// => ["foo", "42"]

然后，您可以使用全局函数parseInt（）来处理这些案例。

对于HTML，不要忘记div可以有很多类。您可以使用另一个字符串拆分处理该情况（在＆＃34;＆＃34;这次）。

Answer 3

我会使用String.split(delimiter)

var pieces = $(this).attr('class').split('-');
console.log(pieces);
> ['foo', 'X', 'boo', 'Y']

现在你有了一个数组（pieces）的所有单词中的单词。

Answer 4

解析这个类似乎有点奇怪。是否可以选择使用数据属性？

e.g。 <div class="foo-X-boo-Y" data-X="valX" data-Y="valY"></div>

var n = $(".foo-X-boo-Y").data("X")

如何使用jQuery匹配ClassName中的元素

4 个答案: