javascript - 在 Jquery 中获取匹配的类

Question

我的 HTML 中有以下 div:

<div id = "foo" class = "bar barbar foobar"></div>

我使用此代码来选择 div:

$('.foo, .barfoo')

是否可以只获取所选类(class)的匹配类(class)？例如，如果我的 HTML 中有一个 barfoo 类，它将返回 barfoo 类，或者如果它存在，它将返回 foo 类有 foo 类。

Answer 1

用逗号分隔选择器，然后 .find 哪个 .matches 是您要迭代的元素:

const selector = '.foo, .barfoo';
const selectors = selector.split(', ');
$(selector).each(function() {
  console.log(
    selectors.find(sel => this.matches(sel))
  );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id = "foo" class = "bar barbar barfoo"></div>
<div class = "foo"></div>

如果要删除 . 部分，请使用 .slice 将其关闭:

const selector = '.foo, .barfoo';
const selectors = selector.split(', ');
$(selector).each(function() {
  console.log(
    selectors.find(sel => this.matches(sel)).slice(1)
  );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id = "foo" class = "bar barbar barfoo"></div>
<div class = "foo"></div>