jQuery 소스코드 해석_jquery의 RemoveAttr() 메소드 분석

이 글에서는 jQuery 소스코드 해석의 RemoveAttr() 메소드를 좀 더 자세히 분석합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

jQuery 프로토타입 객체를 확장하는 방법:

코드 복사 코드는 다음과 같습니다.

jQuery.fn.extend({
//name, 제거할 DOM 요소의 속성 이름을 전달합니다.
​ RemoveAttr: 함수( 이름 ) {

//jQuery.fn 객체, 즉 jQuery 프로토타입 객체의 각 메소드를 사용하여 현재 선택자가 선택한 jQuery 객체 배열을 순회하고 체인 호출을 위한 jQuery 객체를 반환합니다.
          return this.each(function() {
//jQuery의 전역 메소드인 RemoveAttr을 호출하고 순회된 DOM 객체에 this와 제거할 속성의 이름을 전달합니다.
jQuery.removeAttr( this, name );
        });
}
});

jQuery의 전역 메소드 RemoveAttr

코드 복사 코드는 다음과 같습니다.

//jQuery 객체의 전역 메소드 확장
jQuery.extend({

//elem은 탐색된 각 DOM 객체이고, value는 제거할 속성 이름입니다.
​ RemoveAttr: function(elem, value) {
        var 이름, propName,
            i = 0,
//rnotwhite는 (/S /g)
//값이 " "이면 논리 AND 표현식의 값은 null입니다
//값이 "title href"라고 가정하면 논리 AND 연산자의 피연산자 모두 불리언 값이 아니므로 이때 attrNames는 ["title", "href"]가 반환됩니다.
//match는 문자열 내에서 지정된 값을 검색하거나 하나 이상의 정규 표현식에 대한 일치 항목을 찾고 일치 결과를 저장하는 배열을 반환하는 JavaScript 문자열 메서드입니다. 다른 유형은 오류를 보고합니다.
               attrNames = value && value.match( rnotwhite );
//attrNames가 null이 아니고 현재 DOM 개체의 노드 유형이 1이면 if 문 블록을 입력하고, 그렇지 않으면 함수에서 빠져나와 이 순회를 종료하고 다음 순회를 시작합니다.
If ( attrNames && elem.nodeType === 1 ) {
//이때 attrNames는 제거할 속성 이름, 즉 ["title", "href"]
가 포함된 배열입니다. //while 루프를 실행합니다. 이 방법은 먼저 attrNames에서 요소를 꺼내서 name에 할당하고, i가 1만큼 증가한 다음 name에 값이 있는지 확인하는 것을 의미합니다. 실행이 완료되면 이름에 값이 없을 때까지 다음 루프가 시작됩니다.
               while ( (name = attrNames[i ]) ) {
//속성 이름이 "for", "class" 등 js 키워드와 동일한 이름인 경우 "htmlFor", "className"으로 바꿉니다.
                    propName = jQuery.propFix[ 이름 ] || 이름;

//부울 속성인 경우 특별 처리
If ( jQuery.expr.match.bool.test( 이름 ) ) {
//getSetInput은 입력 요소가 getAttribute("value")를 지원하는지 여부를 감지합니다
//getSetAttribute는 낙타 표기 형식의 속성 이름 설정이 지원되는지 감지합니다.
//!ruseDefault.test( name )은 대소문자를 구분하며 name이 확인된 속성인지 선택된 속성인지 감지합니다.
If ( getSetInput && getSetAttribute || !ruseDefault.test( 이름 ) ) {
//Boolean 속성을 제거하는 것은 실제로 Boolean 속성에 false
값을 할당하는 것입니다. 에게                      } else {
//ie9 이하 지원
//"default-checked" 속성을 "defaultChecked"로 변환하고 false 값을 할당합니다
                                elem[ jQuery.camelCase( "default-" name ) ] =
>                                                                                             }
                    } else {
//부울 속성이 아닌 경우 jQuery의 전역 attr 메소드를 호출하여 속성을 설정합니다.
jQuery.attr(요소, 이름, "");
                }
//getSetAttribute는 setAttribute가 카멜 케이스 이름 지정 형식으로 속성 이름 설정을 지원하는지 테스트하는 데 사용됩니다. 그렇다면 setAttribute 및 getAttribute를 사용할 때 수정된 속성 이름을 사용해야 합니다. (IE6/7과 호환)
//getSetAttibute가 false이면 지원되지 않는다는 의미이며, 지원되면 원래 속성 이름이 사용됩니다.
//특성을 제거하려면 DOM 기본 RemoveAttribute 메소드를 호출하세요.
                    elem.removeAttribute( getSetAttribute ? 이름 : propName );
            }
}
}
});

키워드 속성 수정

코드 복사 코드는 다음과 같습니다.

jQuery.extend({
    propFix: {
        "for": "htmlFor",
        "클래스": "클래스이름"
    }
});
jQuery.extend({
    camelCase: 함수( 문자열 ) {
        return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );
    }
});
var nodeHook, boolHook,
    attrHandle = jQuery.expr.attrHandle,
    ruseDefault = /^(?:checked|selected)$/i,
    getSetAttribute = support.getSetAttribute,
    getSetInput = support.input;
// 설정
div = document.createElement( "div" );
div.setAttribute( "className", "t" );
div.innerHTML = "  a";
a = div.getElementsByTagName("a")[ 0 ];
// 첫 번째 테스트 배치.
select = document.createElement("select");
opt = select.appendChild( document.createElement("option") );
입력 = div.getElementsByTagName("input")[ 0 ];
a.style.cssText = "상단:1px";
// camelCase 클래스에서 setAttribute를 테스트합니다. 작동한다면 get/setAttribute를 수행할 때 attrFixes가 필요합니다(ie6/7)
support.getSetAttribute = div.className !== "t";

입력 입력은 getAttribute("value")

复主代码 代码如下:

// 지원: IE8만 해당
// getAttribute("value")를 신뢰할 수 있는지 확인
input = document.createElement( "input" );
input.setAttribute( "value", "" );
support.input = input.getAttribute( "value" ) === "";

检测是否布尔值属性

复主代码 代码如下:

booleans = "checked|selected|async|autofocus|autoplay|controls| defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",

matchExpr = {
    "bool": new RegExp( "^(?:" booleans ")$", "i" )
},

希望本文所述对大家의 jQuery는 매우 유용합니다.