jQuery seçici düzenli ifadeler

Bir jQuery seçici ile joker karakter veya düzenli ifadeler (kesin terminoloji emin değilim) kullanma hakkında belgelerin peşindeyim.

Bunu kendim aradım ancak sözdizimi ve nasıl kullanılacağı hakkında bilgi bulamadım. Sözdizimi için belgelerin nerede olduğunu bilen var mı?

DÜZENLEME: Özellik filtreleri, bir özellik değerinin desenlerine göre seçim yapmanıza olanak tanır.

James Padolsey, regex'in seçim için kullanılmasına izin veren harika bir filtre yarattı .

Aşağıdakilere sahip olduğunuzu varsayalım div:

<div class="asdf">

Padolsey'nin :regexfiltresi bunu şu şekilde seçebilir:

$("div:regex(class, .*sd.*)")

Ayrıca seçicilerle ilgili resmi belgelere de bakın .

filterDaha karmaşık normal ifade eşleştirmesi uygulamak için işlevi kullanabilirsiniz .

İlk üç div ile eşleşen bir örnek:

$('div')
  .filter(function() {
    return this.id.match(/abc+d/);
  })
  .html("Matched!");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="abcd">Not matched</div>
<div id="abccd">Not matched</div>
<div id="abcccd">Not matched</div>
<div id="abd">Not matched</div>

Bunlar yardımcı olabilir.

Eğer Contains tarafından bulursanız o zaman böyle olacak

    $("input[id*='DiscountType']").each(function (i, el) {
         //It'll be an array of elements
     });

Eğer Starts With ile buluyorsanız, bu böyle olacak

    $("input[id^='DiscountType']").each(function (i, el) {
         //It'll be an array of elements
     });

Eğer Ends With ile buluyorsanız, bu böyle olacak

     $("input[id$='DiscountType']").each(function (i, el) {
         //It'll be an array of elements
     });

Belirli bir dize olmayan kimliğe sahip öğeleri seçmek istiyorsanız

    $("input[id!='DiscountType']").each(function (i, el) {
         //It'll be an array of elements
     });

Boşluğa göre ayrılmış, belirli bir sözcük içeren adın öğelerini seçmek istiyorsanız

     $("input[name~='DiscountType']").each(function (i, el) {
         //It'll be an array of elements
     });

Belirli bir dizeye eşit olan kimliğe eşit olan veya bu dizeyle başlayan ve ardından kısa çizgi olan öğeleri seçmek istiyorsanız

     $("input[id|='DiscountType']").each(function (i, el) {
         //It'll be an array of elements
     });

Normal ifadeyi kullanımınız, bir özniteliğin belirli bir dizeyle başlayıp başlamadığını test etmekle sınırlıysa, ^JQuery seçicisini kullanabilirsiniz .

Örneğin, yalnızca "abc" ile başlayan kimliğe sahip div seçmek istiyorsanız şunları kullanabilirsiniz:

$("div[id^='abc']")

Normal ifade kullanımından kaçınmak için çok sayıda yararlı seçici burada bulabilirsiniz: http://api.jquery.com/category/selectors/attribute-selectors/

var test = $('#id').attr('value').match(/[^a-z0-9 ]+/);

Hadi bakalım!

JQuery işlevi ekleme,

(function($){
    $.fn.regex = function(pattern, fn, fn_a){
        var fn = fn || $.fn.text;
        return this.filter(function() {
            return pattern.test(fn.apply($(this), fn_a));
        });
    };
})(jQuery);

Sonra,

$('span').regex(/Sent/)

metin eşleşmeleri / Gönderilmiş / ile tüm yayılma öğelerini seçer.

$('span').regex(/tooltip.year/, $.fn.attr, ['class'])

sınıfları / tooltip.year/ ile eşleşen tüm span öğelerini seçecektir.

kimlikleri ve sınıfları hala özniteliktir, bu nedenle uygun şekilde seçerseniz bunlara regexp öznitelik filtresi uygulayabilirsiniz. Daha fazla bilgiyi buradan edinebilirsiniz: http://rosshawkins.net/archive/2011/10/14/jquery-wildcard-selectors-some-simple-examples.aspx

$("input[name='option[colour]'] :checked ")

Sadece gerçek zamanlı örneğimi veriyorum:

Yerel javascript kimlikleri "select2-qownerName_select-sonuç" ile başlayan öğeleri bulmak için aşağıdaki snippet'i kullandım.

document.querySelectorAll("[id^='select2-qownerName_select-result']");

Javascript'ten jQuery'ye geçtiğimizde, yukarıdaki kod parçasını, mantığı bozmadan daha az kod değişikliği içeren aşağıdakilerle değiştirdik.

$("[id^='select2-qownerName_select-result']")

Sadece belirli bir dize içeren öğeleri seçmek istiyorsanız, aşağıdaki seçiciyi kullanabilirsiniz:

$(':contains("search string")')