jQuery 선택기 정규식

jQuery 선택기와 함께 와일드 카드 또는 정규 표현식 (정확한 용어는 확실하지 않음) 사용에 대한 설명서를 읽었습니다.

나는 이것을 직접 찾았지만 구문과 사용법에 대한 정보를 찾을 수 없었습니다. 구문에 대한 문서가 어디에 있는지 아는 사람이 있습니까?

편집 : 속성 필터를 사용하면 속성 값의 패턴을 기반으로 선택할 수 있습니다.

James Padolsey 는 정규식을 선택할 수 있는 훌륭한 필터 를 만들었습니다 .

다음이 있다고 가정하십시오 div.

<div class="asdf">

Padolsey의 :regex필터는 다음과 같이 선택할 수 있습니다.

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

또한 선택기 공식 문서를 확인하십시오 .

이 filter함수를 사용하여 더 복잡한 정규식 일치를 적용 할 수 있습니다 .

다음은 처음 세 div와 일치하는 예입니다.

$('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>

도움이 될 수 있습니다.

Contains 로 찾는다면 다음과 같습니다.

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

Starts With 로 찾는다면 다음과 같습니다.

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

Ends With 로 찾는다면 다음과 같습니다.

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

주어진 문자열이 아닌 id를 가진 요소를 선택하려면

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

이름이 주어진 단어를 포함하는 요소를 선택하려면 공백으로 구분하십시오

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

id가 주어진 문자열과 같거나 해당 문자열로 시작하고 하이픈이있는 요소를 선택하려는 경우

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

속성이 특정 문자열로 시작하는지 정규식 사용이 테스트로 제한되는 경우 ^JQuery 선택기를 사용할 수 있습니다 .

예를 들어 ID가 "abc"로 시작하는 div 만 선택하려는 경우 다음을 사용할 수 있습니다.

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

정규식 사용을 피하는 매우 유용한 선택기는 다음에서 찾을 수 있습니다. http://api.jquery.com/category/selectors/attribute-selectors/

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

여기 있습니다!

jQuery 함수를 추가하십시오.

(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);

그때,

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

텍스트가 / Sent /와 일치하는 모든 범위 요소를 선택합니다.

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

클래스가 /tooltip.year/와 일치하는 모든 범위 요소를 선택합니다.

ID와 클래스는 여전히 속성이므로 적절하게 선택하면 정규 표현식 속성 필터를 적용 할 수 있습니다. 여기에서 더 읽으십시오 : http://rosshawkins.net/archive/2011/10/14/jquery-wildcard-selectors-some-simple-examples.aspx

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

나는 단지 실시간 예제를 제공하고 있습니다.

네이티브 자바 스크립트에서 다음 스 니펫을 사용하여 id를 가진 요소를 찾기 위해 "select2-qownerName_select-result"로 시작합니다.

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

우리가 자바 스크립트에서 jQuery로 전환했을 때 우리는 위의 스 니펫을 다음과 같이 바 꾸었습니다.이 코드는 로직을 방해하지 않고 코드 변경이 적습니다.

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

주어진 문자열을 포함하는 요소를 선택하려면 다음 선택기를 사용할 수 있습니다.

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