「project [0-9]」クラスを持つ複数のdivがあります。
_<div class="project1"></div>
<div class="project2"></div>
<div class="project3"></div>
<div class="project4"></div>
_
要素に「project [0-9]」クラスがあるかどうかを確認したい。 .hasClass("project")
がありますが、一致する数字にこだわっています。
何か案が?
startswith CSS3 selector を使用して、これらのdivを取得できます。
_$('div[class^="project"]')
_
特定の要素をチェックするには、hasClass
ではなく .is()
を使用します。
_$el.is('[class^="project"]')
_
正確な_/project\d/
_正規表現を使用するには、 jQueryセレクターの正規表現 をチェックアウトするか、
_/(^|\s)project\d(\s|$)/.test($el.attr("class"))
_
あなたのhtmlのためのより良いアプローチは次のとおりです:これらのdivはいくつかの共通のプロパティを共有していると思います。
<div class="project type1"></div>
<div class="project type2"></div>
<div class="project type3"></div>
<div class="project type4"></div>
次に、以下を使用してそれらを見つけることができます。
$('.project')
$('div[class*="project"]')
このようなもので失敗しません:
<div class="some-other-class project1"></div>
$('div[class^="project"]')
このような何かで失敗します:
<div class="some-other-class project1"></div>
JQueryを拡張する代替手段を次に示します。
// Select elements by testing each value of each element's attribute `attr` for `pattern`.
jQuery.fn.hasAttrLike = function(attr, pattern) {
pattern = new RegExp(pattern)
return this.filter(function(idx) {
var elAttr = $(this).attr(attr);
if(!elAttr) return false;
var values = elAttr.split(/\s/);
var hasAttrLike = false;
$.each(values, function(idx, value) {
if(pattern.test(value)) {
hasAttrLike = true;
return false;
}
return true;
});
return hasAttrLike;
});
};
jQuery('div').hasAttrLike('class', 'project[0-9]')
sandinmyjointsのオリジナル: https://github.com/sandinmyjoints/jquery-has-attr-like/blob/master/jquery.hasAttrLike.js (ただしエラーがあったので修正しました)