Common JavaScript function libraries _ javascript skills

Source: Internet
Author: User
In WEB development, javascript provides many functions for developers. These functions are sufficient before Ajax is popular, but it may be difficult to build an interactive application. To this end, I have collected some JavaScript Functions that I usually use. They are also common in other JS libraries. Now I want to sort them out and add comments for your convenience. I hope they will help you.
Note: assume that all of the following functions are stored in a CC object for reference.

The Code is as follows:


// This method is believed to be the most commonly used,
// Although it is not as powerful as the selector, it also has a small enhanced version, which can be used to query the child element of the ID under the specified Node
Function $ (id, p ){
// Whether the id is a string or an HTML Node
Var iss = id instanceof String | typeof id = "string ";
If (iss &&! P)
Return document. getElementById (id );
// If it is a node, the node is directly returned.
If (! Iss)
Return id;
// If id and p are the same element, return directly
If (p. id = id)
Return p;
// Search for the parent node
Var child = p. firstChild;
While (child ){
If (child. id = id)
Return child;
// Recursive search
Var v = this. $ (id, child );
If (v)
Return v;
Child = child. nextSibling;
}
// If no result is found, null is returned.
Return null;
}


The Code is as follows:


Each: function (object, callback, args ){
If (! Object ){
Return object;
}
If (args ){
If (object. length = undefined ){
For (var name in object)
If (callback. apply (object [name], args) === false) break;
} Else for (var I = 0, length = object. length; I <length; I ++)
If (callback. apply (object [I], args) === false) break;
} Else {
If (object. length = undefined ){
For (var name in object)
If (callback. call (object [name], name, object [name]) === false) break;
} Else for (var I = 0, length = object. length, value = object [0];
I <length & callback. call (value, I, value )! = False;
Value = object [++ I]) {}
}
Return object;
}


The Code is as follows:


// Array
Function isArray (obj ){
Return (typeof obj = "array" | obj instanceof Array );
},
// String
Function isString (obj ){
Return (typeof obj = "string" | obj instanceof String );
},
// Function
Function isFunction (obj ){
Return (typeof obj = "function" | obj instanceof Function );
},
// Numeric type
Function isNumber (ob ){
Return (typeof ob = "number" | ob instanceof Number );
}


The Code is as follows:


// Return the submission string of the elements that can be submitted in the form.
// Example
//
// The user = rock & password = 123 is returned after the call.
// The data has been processed by encodeURIComponent and is friendly to non-English characters.
// If no name exists in the form element, id is used as the provided character name.
Function formQuery (f ){
// F, a Form.
Var formData = "", elem = "", f = CC. $ (f );
Var elements = f. elements;
Var length = elements. length;
For (var s = 0; s <length; ++ s ){
Elem = elements [s];
If (elem. tagName = 'input '){
If (elem. type = 'Radio '| elem. type = 'checkbox ')&&! Elem. checked ){
Continue;
}
}
If (formData! = ""){
FormData + = "&";
}
FormData + = encodeURIComponent (elem. name | elem. id) + "="
+ EncodeURIComponent (elem. value );
}
Return formData;
}


The Code is as follows:


/**
* Removes the specified element from the array.
* The parameter can either pass an integer subscript or an array data.
*/
Array. prototype. remove = (function (p ){
// The parameter is a subscript.
If (CC. isNumber (p )){
If (p <0 | p> = this. length ){
Throw "Index Of Bounds:" + this. length + "," + p;
}
This. splice (p, 1) [0];
Return this. length;
}
// The parameter is an array of data, and the subscript must be found for operation.
If (this. length> 0 & this [this. length-1] = p ){
This. pop ();
} Else {
Var pos = this. indexOf (p );
If (pos! =-1 ){
This. splice (pos, 1) [0];
}
}
Return this. length;
});


The Code is as follows:


Array. prototype. indexOf = (function (obj ){
For (var I = 0, length = this. length; I <length; I ++ ){
If (this [I] = obj) return I;
}
Return-1;
});


The Code is as follows:


/**
* The omnipotent and simple form verification function, which utilizes the dynamic JavaScript language features and looks mysterious,
* The actual image is very good. You can see the example clearly.
*/
Validate: function (){
Var args = CC. $ A (arguments ),
Form = null;
// If the form element is not empty, it should be placed in the first parameter.
If (! CC. isArray (args [0]) {
Form = CC. $ (args [0]);
Args. remove (0 );
}
// If any configuration item exists, it should be placed in the last parameter.
// Cfg. queryString = true | false;
// Cfg. callback = function
// Cfg. ignoreNull
// Nofocus: true | false
Var B = CC. isArray (B )? {}: Args. pop (),
D;
Var queryStr = B. queryString,
IgnoreNull = B. ignoreNull,
Cb = B. callback;
Var result = queryStr? '':{};
CC. each (args,
Function (I, v ){
// If this name element does not exist in fomr, it is obtained by id.
Var obj = v [0]. tagName? V [0]: form? Form [v [0]: CC. $ (v [0]);
// Console. debug ('checking field: ', v, 'current value:' + obj. value );
Var value = obj. value,
Msg = v [1],
D = CC. isFunction (v [2])? V [3]: v [2];
// Option
If (! D | typeof d! = 'Object') d = B;
// Whether to ignore null
If (! D. ignoreNull & (value = ''| value = null )){
// If the callback function does not exist, call alert to display the error message.
If (! D. callback) CC. alert (msg, obj, form );
// If callback exists, pay attention to the three parameters passed
// Msg: Message, obj: node, form: corresponding form, if any
Else d. callback (msg, obj, form );
// Whether or not to aggregate after an error occurs
If (! D. nofocus) obj. focus ();
Result = false;
Return false;
}
// Custom Verification Method
If (CC. isFunction (v [2]) {
Var ret = v [2] (value, obj, form );
Var pass = (ret! = False );
If (CC. isString (ret )){
Msg = ret;
Pass = false;
}
If (! Pass ){
If (! D. callback) CC. alert (msg, obj, form );
// Same as above
Else d. callback (msg, obj, form );
If (! D. nofocus) obj. focus ();
Result = false;
Return false;
}
}
// If queryString is not set and verified, an object is returned if no form exists,
// This object contains data in the shape of {elementName | elementId: value.
If (queryStr &&! Form ){
Result + = (result = '')?
(Typeof obj. name = 'undefined' | obj. name = '')? Obj. id: obj. name) +
'=' + Value: '&' + v [0] + '=' + value;
} Else if (! Form ){
Result [v [0] = value;
}
});
// If queryString: true is set and verification is passed, the submission string of form is returned.
If (result! = False & form & queryStr) result = CC. formQuery (form );
Return result;
}


The Code is as follows:


/**
* Application Object replacement template content
* Templ ({name: 'Rock '},'{Name}');
* St: whether the property is retained
*/
Templ: function (obj, str, st ){
Return str. replace (/\ {([\ w _ $] +) \}/g, function (c, $1 ){
Var a = obj [$1];
If (a === undefined | a === null ){
If (st = undefined) return '';
Switch (st ){
Case 0:
Return '';
Case 1:
Return $1;
Default:
Return c;
}
}
Return;
});
}

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.