대/소문자를 구분하지 않는 jQuery: contains selector가 있습니까?

대/소문자를 구분하지 않는 jQuery: contains selector가 있습니까?

contains jQuery selector의 대소문자를 구분하지 않는 버전이 있습니까? 아니면 모든 요소를 루프하고 .text()를 내 문자열과 비교하여 수동으로 작업을 수행해야 합니까?

jQuery 1.2에서 하게 된 것은 다음과 같습니다.

jQuery.extend(
    jQuery.expr[':'], { 
        Contains : "jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0" 
});

jquery를 확장하여 :대소문자를 구분하지 않는 선택기를 포함하고, :contains 선택기는 변경되지 않습니다.

편집: jQuery 1.3(고마워 @user95227) 이상의 경우 다음이 필요합니다.

jQuery.expr[':'].Contains = function(a,i,m){
     return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};

편집: 보아하니 를 사용하여 DOM에 직접 액세스하는 것 같습니다.

(a.textContent || a.innerText || "") 

대신에

jQuery(a).text()

이전 식에서는 속도가 상당히 빨라지므로 속도가 문제가 될 경우 위험을 감수해야 합니다.(@John의 질문 참조)

최신 편집:jQuery 1.8의 경우 다음과 같아야 합니다.

jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
    return function( elem ) {
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
    };
});

선택적으로 대소문자를 구분하지 않도록 하려면 http://bugs.jquery.com/ticket/278

$.extend($.expr[':'], {
  'containsi': function(elem, i, match, array)
  {
    return (elem.textContent || elem.innerText || '').toLowerCase()
    .indexOf((match[3] || "").toLowerCase()) >= 0;
  }
});

그 다음에 사용:containsi대신에:contains

jQuery 1.3에서 이 방법은 더 이상 사용되지 않습니다.이 기능을 작동시키려면 다음과 같은 기능으로 정의해야 합니다.

jQuery.expr[':'].Contains = function(a,i,m){
    return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};

만약 누군가(나와 같은)가 관심이 있다면, contains definition에서 do a와 m[3]의 의미는 무엇입니까?

---

KEY/LEGEND: jQuery에서 선택기 정의에 사용할 수 있도록 만든 매개 변수:

r = j세사 중인 요소의 배열을 쿼리합니다.(예: r.length = 요소 수)

i = 어레이 내에서 현재 조사 중인 요소의 인덱스입니다.

현재 정밀 조사 중인 = 요소일치된 결과에 포함시키려면 선택기 문이 true를 반환해야 합니다.

m[2] = nodeName 또는 *(콜론 왼쪽)를 찾습니다.

m[3] = 매개 변수가 :sys(param)로 전달되었습니다.일반적으로 :nth-of-type(5)에서와 같은 인덱스 번호이거나 :color(파란색)와 같은 문자열입니다.

jQuery 1.8에서 사용해야 합니다.

jQuery.expr[":"].icontains = jQuery.expr.createPseudo(function (arg) {                                                                                                                                                                
    return function (elem) {                                                            
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;        
    };                                                                                  
});

약간 더 빨리 수행되고 정규 표현을 사용할 수 있는 변형은 다음과 같습니다.

jQuery.extend (
    jQuery.expr[':'].containsCI = function (a, i, m) {
        //-- faster than jQuery(a).text()
        var sText   = (a.textContent || a.innerText || "");     
        var zRegExp = new RegExp (m[3], 'i');
        return zRegExp.test (sText);
    }
);

---

대소문자를 구분하지 않을 뿐만 아니라 다음과 같은 강력한 검색도 가능합니다.

• $("p:containsCI('\\bup\\b')")("업" 또는 "업"과 일치하지만 "위", "웨이크업" 등은 일치하지 않음)
• $("p:containsCI('(?:Red|Blue) state')")("빨간색 상태" 또는 "파란색 상태"와 일치하지만 "업 상태" 등은 일치하지 않음)
• $("p:containsCI('^\\s*Stocks?')")("스톡" 또는 "스톡"과 일치하지만 문단의 시작 부분에서만 일치합니다(선행 공백은 무시).

늦을지도 모르지만,

이쪽으로 가는 게 낫겠어요.

$.extend($.expr[":"], {
"MyCaseInsensitiveContains": function(elem, i, match, array) {
return (elem.textContent || elem.innerText || "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0;
}
});

이렇게 하면 jQuery의 네이티브 '.contains'를 변경할 수 없습니다.나중에 기본 설정이 필요할 수도 있습니다. 변경되면 다시 스택 오버플로우로 돌아갈 수도 있습니다.

jQuery.expr[':'].contains = function(a,i,m){
    return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};

업데이트 코드는 1.3에서 잘 작동하지만 "포함"은 이전 예제와 달리 첫 번째 문자에서 소문자여야 합니다.

HTML 코드에서 대소문자 구분을 무시하는 텍스트를 찾으려면 아래를 참조하십시오.

 $.expr[":"].contains = $.expr.createPseudo(function(arg) {
            return function( elem ) {
                return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
            };
        });
        $("#searchTextBox").keypress(function() {
          if($("#searchTextBox").val().length > 0){
            $(".rows").css("display","none");
            var userSerarchField = $("#searchTextBox").val();
            $(".rows:contains('"+ userSerarchField +"')").css("display","block");
          } else {
            $(".rows").css("display","block");
          }              
        });

또한 이 링크를 사용하여 jQuery 버전인 MakejQuery: contains Case-Insensitive를 기반으로 코드를 무시하는 사례를 찾을 수 있습니다.

정규식을 사용하는 빠른 버전입니다.

$.expr[':'].icontains = function(el, i, m) { // checks for substring (case insensitive)
    var search = m[3];
    if (!search) return false;

    var pattern = new RegExp(search, 'i');
    return pattern.test($(el).text());
};

다음과 같은 문제가 발생했습니다.

// This doesn't catch flac or Flac
$('div.story span.Quality:not(:contains("FLAC"))').css("background-color", 'yellow');

이것은 연장할 필요 없이 작동합니다.

$('div.story span.Quality:not([data*="flac"])').css("background-color", 'yellow');

이것도 작동하지만, 아마도 "수동 루프" 범주에 속할 것입니다.

$('div.story span.Quality').contents().filter(function()
{
  return !/flac/i.test(this.nodeValue);
}).parent().css("background-color", 'yellow');

새 변수 이름 subString을 지정하고 일부 요소 텍스트에 검색할 문자열을 입력합니다.를 사용하여 제 를 선택합니다.$("elementsYouNeed") 및필기로 ..filter()..filter()은 요각를비다니의 각 입니다.$("elementsYouNeed")기능이 있는.

가 사용하는 에서 i는 .toLowerCase()요소 텍스트의 경우 대/소문자를 구분하지 않고 subString이 있는지 확인할 수 있는 subString. 후에 그후에에..filter()메서드는 일치 요소의 하위 집합에서 새 jQuery 개체를 생성합니다.

이제 matchObjects에서 match 요소를 가져와 원하는 대로 할 수 있습니다.

var subString ="string you want to match".toLowerCase();

var matchObjects = $("elementsYouNeed").filter(function () {return $(this).text().toLowerCase().indexOf(subString) > -1;});

언급URL : https://stackoverflow.com/questions/187537/is-there-a-case-insensitive-jquery-contains-selector