4

属性名にワイルドカードを含むjQueryを使用してすべてのDOM要素を検索することは可能ですか？

次のHTMLについて考えてみます。

<input 
     id="val1" 
     type="text" 
     data-validate-required 
     data-validate-minlength="3" 
     data-validate-email />

私が達成しようとしているのは、属性名がで始まるすべてのdomノードを見つけることです。data-validate-

私が理解している限り、ここで説明されているワイルドカードは属性の「値」に関係しています。

この理由は、-どの要素を検証する必要があるかを調べたい-その後、どの検証パラメーター（-emailなど）が機能するかを調べたいからです。

ありがとう

4

4 に答える 4

5

カスタム疑似クラスを作成して、属性名を正規表現と一致させることができます: http://jsfiddle.net/hN6vx/。

jQuery.expr.pseudos.attr = $.expr.createPseudo(function(arg) {
    var regexp = new RegExp(arg);
    return function(elem) {
        for(var i = 0; i < elem.attributes.length; i++) {
            var attr = elem.attributes[i];
            if(regexp.test(attr.name)) {
                return true;
            }
        }
        return false;
    };
});

使用法：

$(":attr('^data-')")
于 2012-11-04T20:22:05.003 に答える
3

JQuery はXPathに大きく依存しており、XPath はワイルドカード属性の選択をサポートしていないため、回避しようとしているオーバーヘッドがなければ不可能です。

物事をきれいに保つために、独自のセレクターを作成する可能性は常にあります。

//adds the :dataValidate selector
$.extend($.expr[':'],{
    dataValidate: function(obj){
        var i,dataAttrs=$(obj).data()
        for (i in dataAttrs) {
                if (i.substr(0,8)=='validate') return true;
        }
        return false;
    }
})

これにより、通常の jQuery セレクターで :dataValidate を使用できるようになります。

$(".element:dataValidate .etc")

JSFiddle の作業: http://jsfiddle.net/rZXZ3/

于 2012-11-04T20:32:09.157 に答える
2

あなたは属性をループすることができます：

$('.element').each(function() {
  $.each(this.attributes, function(i, att){
     if(att.name.indexOf('data-validate')==0){
         console.log(att.name);
     }
  });
});
于 2012-11-04T20:08:39.050 に答える
2

filterメソッドとdatasetオブジェクトを使用できます。

読み取りモードと書き込みモードの両方で、要素に設定されたすべてのカスタム データ属性 (data-*) へのアクセスを許可します。これは、カスタム データ属性ごとに 1 つのエントリを持つ DOMString のマップです。

$("input").filter(function(){
    var state = false;
    for (i in this.dataset) 
        if (i.indexOf('validate') > -1) state = true;

    return state             
})​

http://jsfiddle.net/Pxpfa/

于 2012-11-04T20:19:16.897 に答える