RemoveAttr () method analysis based on jQuery source code, jqueryremoveattr
This article analyzes in detail the removeAttr () method of jQuery source code interpretation. Share it with you for your reference. The specific analysis is as follows:
Method for extending the jQuery prototype object:
Copy codeThe Code is as follows: jQuery. fn. extend ({
// Name: name of the attribute to be removed from the DOM element.
RemoveAttr: function (name ){
// Use the jQuery. fn object, that is, the jQuery prototype object's each method traverses the jQuery object array selected by the current selector and returns the jQuery object for chained calling.
Return this. each (function (){
// Call the global method removeAttr of jQuery to pass in the DOM object this and the name of the property to be removed.
JQuery. removeAttr (this, name );
});
}
});
JQuery's global method removeAttr
Copy codeThe Code is as follows: // The Global Method for extending the jQuery object
JQuery. extend ({
// Elem is the retrieved DOM object and value is the attribute name to be removed.
RemoveAttr: function (elem, value ){
Var name, propName,
I = 0,
// Rnotwhite is (/\ S +/g)
// If the value is "", the value of the logic and expression is null.
// If the value is assumed to be "title href", the second operand is returned because neither the logic nor the operator has a Boolean value. At this time, attrNames is ["title ", "href"].
// Match is a JavaScript string method. You can search for a specified value in a string or find a match with one or more regular expressions. Then, an array containing the matching result is returned. For other types, an error is returned.
AttrNames = value & value. match (rnotwhite );
// If attrNames is not null and the node type of the current DOM object is 1, enter the if statement block. Otherwise, exit the function and end the traversal and start the next traversal.
If (attrNames & elem. nodeType = 1 ){
// At this time, attrNames is an array containing the attribute name to be removed, that is, ["title", "href"]
// Execute the while loop, which means that an element is first obtained from attrNames and assigned to name, I increases by 1, and then judge whether name has a value and a value, go to the cyclic execution page. After the execution is complete, start the next loop until the name has no value and jumps out of the loop.
While (name = attrNames [I ++]) {
// If the attribute name has the same name as the js keyword, such as "for" and "class", replace it with "htmlFor" and "className ".
PropName = jQuery. propFix [name] | name;
// Special treatment for Boolean attributes
If (jQuery. expr. match. bool. test (name )){
// GetSetInput checks whether the Input element supports getAttribute ("value ")
// GetSetAttribute check whether attribute names in the hump naming format can be set
//! RuseDefault. test (name) is case-insensitive and checks whether the name is a checked or selected attribute,
If (getSetInput & getSetAttribute |! RuseDefault. test (name )){
// Removing the Boolean attribute is actually assigning a value to false for the Boolean attribute.
Elem [propName] = false;
} Else {
// Ie9 or lower supported
// Convert the property "default-checked" to "defaultChecked" and assign the value false.
Elem [jQuery. camelCase ("default-" + name)] =
Elem [propName] = false;
}
} Else {
// If it is not a Boolean attribute, call the global attr method of jQuery to set the attribute.
JQuery. attr (elem, name ,"");
}
// GetSetAttribute is used to test whether setAttribute supports setting attribute names in the hump naming format. If yes, you need to use the corrected attribute names when using setAttribute and getAttribute. (Compatible with ie6/7)
// If getsetattivity is equal to false, it indicates that this parameter is not supported, the corrected attribute name is used, and the original attribute name is supported.
// Call the native removeAttribute method of DOM to remove attributes.
Elem. removeAttribute (getSetAttribute? Name: propName );
}
}
}
});
Keyword attribute correction
Copy codeThe Code is as follows: jQuery. extend ({
PropFix :{
"For": "htmlFor ",
"Class": "className"
}
});
JQuery. extend ({
CamelCase: function (string ){
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;
// Setup
Div = document. createElement ("div ");
Div. setAttribute ("className", "t ");
Div. innerHTML = "<link/> <table> </table> <a href = '/A'> a </a> <input type = 'checkbox'/> ";
A = div. getElementsByTagName ("a") [0];
// First batch of tests.
Select = document. createElement ("select ");
Opt = select. appendChild (document. createElement ("option "));
Input = div. getElementsByTagName ("input") [0];
A.style.css Text = "top: 1px ";
// Test setAttribute on camelCase class. If it works, we need attrFixes when doing get/setAttribute (ie6/7)
Support. getSetAttribute = div. className! = "T ";
Check whether the input supports getAttribute ("value ")
Copy codeThe Code is as follows: // Support: IE8 only
// Check if we can trust getAttribute ("value ")
Input = document. createElement ("input ");
Input. setAttribute ("value ","");
Support. input = input. getAttribute ("value") = "";
Check for Boolean attribute
Copy codeThe Code is as follows: booleans = "checked | selected | async | autofocus | autoplay | controls | defer | disabled | hidden | ismap | loop | multiple | open | readonly | required | scoped ",
MatchExpr = {
"Bool": new RegExp ("^ (? : "+ Booleans +") $ "," I ")
},
I hope this article will help you with jQuery programming.