jQuery 선택기 정규식

StackOverflow https://stackoverflow.com/questions/190253

문제

jQuery 선택기와 함께 와일드 카드 또는 정규식 (정확한 용어에 대해서는 확실하지 않음)을 사용하는 방법에 대한 문서를 작성했습니다.

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

편집 : 속성 필터를 사용하면 속성 값의 패턴에 따라 선택할 수 있습니다.

도움이 되었습니까?

해결책

James Padolsey를 만들었습니다 멋진 필터 이를 통해 REGEX를 선택에 사용할 수 있습니다.

다음이 있다고 가정 해 봅시다 div:

<div class="asdf">

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

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

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

다른 팁

당신은 사용할 수 있습니다 filter 더 복잡한 Regex 매칭을 적용하는 기능.

다음은 처음 세 개의 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>

이것들은 도움이 될 수 있습니다.

당신이 찾고 있다면 포함 그러면 이렇게 될 것입니다

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

당신이 찾고 있다면 시작합니다 그러면 이렇게 될 것입니다

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

당신이 찾고 있다면 로 끝나다 그러면 이렇게 될 것입니다

     $("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
     });

요소를 선택하려면 ID에는 공간으로 구분 된 주어진 단어가 포함되어 있습니다

     $("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
     });

정규 표현식을 사용하는 것이 특정 문자열로 시작되는지 테스트하도록 제한되면 ^ jQuery 선택기를 사용할 수 있습니다.

예를 들어 "ABC"로 시작하는 ID로 DIV 만 선택하려면 사용할 수 있습니다. $("div[id^='abc']")

Regex 사용을 피하기 위해 매우 유용한 선택기를 여기에서 찾을 수 있습니다. http://api.jquery.com/category/selectors/attribute-selectors/

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

당신은 간다!

ID 및 클래스는 여전히 속성이므로 그에 따라 선택하면 Regexp 속성 필터를 적용 할 수 있습니다. 자세히보기 :http://rosshawkins.net/archive/2011/10/14/jquery-wildcard-selectors-some-somple-examples.aspx

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/)

텍스트 일치 /send /로 모든 스팬 요소를 선택합니다.

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

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

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

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

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

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

Native JavaScript에서 나는 Snippet을 따라 IDS가있는 요소를 찾기 위해 사용했습니다.

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

우리가 JavaScript에서 jQuery로 전환했을 때, 우리는 스 니펫 위를 다음과 같이 교체했습니다. 여기에서 논리를 방해하지 않고 코드 변경이 적습니다.

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

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top