Summary of jquery utility functions

One, array and object manipulation

1. $.each--traversal

$.each (Obj,function (PARAM1,PARAM2))
When iterating through an array: param1 is the element ordinal and param2 is the element content;
When traversing an object: Param1 is the element property name and param2 is the element attribute value.

For example:
① traversing an array:

$ (function () {            var arrstu = {"Zhang San:": "60", "John Doe:": "70", "Wang ER:": "+"}            var strcontent = "<li class= ' title ' > surname Name: Score </li> ";            $.each (Arrstu, function (Name, Value) {                strcontent + = "<li>" + Name + Value + "</li>";            })            $ ("ul"). Append (strcontent);        })

② traversing objects:

<script type= "Text/javascript" >        $ (function () {            var strcontent = "<li class= ' title ' > Properties: Value </li > ";            $.each ($.get, Function (property, Value) {                strcontent + = "<li>" + Property + ":" + Value + "</li>";            })            $ ("ul"). Append (strcontent);        })    </script >

2.$.grep--filtering arrays

$.grep (Array,function (Element,index)): array is the element to be filtered, elements in an array, and index is the ordinal of the element in the arrays (0).

<script type= "Text/javascript" >        $ (function () {            var strtmp = "Pre-filter data:";            var arrnum = [2, 8, 3, 7, 4, 9, 3, ten, 9, 7, +];            var arrget = $.grep (Arrnum, function (ele, index) {                return ele > 5 && Index < 8//element value greater than 5 and ordinal less than 8            }) 
   
    strtmp + = Arrnum.join ();            Strtmp + = "<br/><br> filtered data:";            Strtmp + = Arrget.join ();            $ ("#divTip"). Append (strtmp);        },true)    </script >
   

Execution Result:

Pre-filter data: 2,8,3,7,4,9,3,10,9,7,21
Filtered data: 8,7,9,10

3.$.map--Data changes

$.map (Array,function (Element,index)): array is the element to be filtered, elements in array, index is the ordinal of the element

<script type= "Text/javascript" >        $ (function () {            var strtmp = "Pre-change data:";            var arrnum = [2, 8, 3, 7, 4, 9, 3, ten, 9, 7, +];            var arrget = $.map (Arrnum, function (ele, index) {                if (Ele > 5 && Index < 8) {//element value greater than 5 and ordinal less than 8                    return Ele + 1; element increased by 1                }            )            strtmp + = Arrnum.join ();            Strtmp + = "<br/><br> post-change data:"            strtmp + = Arrget.join ();            $ ("#divTip"). Append (strtmp);        })    </script>

Execution Result:

Pre-change data: 2,8,3,7,4,9,3,10,9,7,21
Post-change data: 9,8,10,11

4.$.inarray ()-- Find array elements

$.inarray (Value,array): Finds the element in the array and returns 1 if it does not exist.

$ (function () {            var strtmp = "data to be searched:";            var arrnum = [4, 2, 5];            var arrpos = $.inarray (arrnum);            Strtmp + = Arrnum.join ();            Strtmp + = "<br/><br>12 search results:"            strtmp + = Arrpos;            $ ("#divTip"). Append (strtmp);        })

Execution Result:

Pending Search data: 4,21,2,12,5
12 Search Results: 3

Second, browser detection

$.browser object that can handle browser-related detections.
Note: The object was added in jquery1.4.2, but it was removed in 1.9.

$.support.boxmodel Check whether the page is a standard box model. Testing of the object in 1.10 has also been removed.

Three, string manipulation

$.trim (): removes whitespace from the left and right sides of the string. This is the only function in the jquery core library for string processing.

Four, test function

1.$.isemptyobject (obj): detects if the parameter is an empty object.

<script type= "Text/javascript" >        $ (function () {            var obj0 = {};            var obj1 = {"Name": "Taoguorong"};            var obj2 = [];            var obj3 = [1];            var Obj4;            var strtmp = "Obj0 is empty:" + $.isemptyobject (obj0);           True            strtmp + = "<br><br>obj1 is empty:" + $.isemptyobject (obj1);//false            strtmp + = "<br><br >obj2 is empty: "+ $.isemptyobject (obj2);//true            strtmp + =" <br><br>obj3 is empty: "+ $.isemptyobject (OBJ3) ;//false            strtmp + = "<br><br>obj4 is empty:" + $.isemptyobject (OBJ4);//true            $ ("#divTip"). Append ( strtmp);        })    </script >

2.$.isplainobject (obj): detects whether the parameter is the original object, which is created through {} or New object ().

<script type= "Text/javascript" >        $ (function () {            var obj0 = {};            var obj1 = new Object ();            var obj2 = "null";            var obj3 = {"A": 1};            var obj4 = new Object (1);            var obj5 = 1;            var strtmp = "Obj0 is the original object:" + $.isplainobject (obj0);           True            strtmp + = "<br><br>obj1 is the original object:" + $.isplainobject (obj1);//true            strtmp + = "<br> <br>obj2 is the original object: "+ $.isplainobject (obj2);//false            strtmp + =" <br><br>obj3 is the original object: "+ $. Isplainobject (OBJ2);//false            strtmp + = "<br><br>obj4 is the original object:" + $.isplainobject (OBJ2);//false            strtmp + = "<br><br>obj5 is the original object:" + $.isplainobject (obj2);//false            $ ("#divTip"). Append (strtmp );        })    </script >

Description: When the new Object () method takes a parameter, it is not the original object.

3.$.contain (container,contained): two parameters are DOM objects, returns True if the container object contains contained objects, otherwise false.

V. URL operation

$.param (obj): where obj is an array or jquery object, the method serializes it into a key-value pair.

<script type= "Text/javascript" > $ (function () {var arrinfo = {id:101, name: "Tao", sex:0};                /basic information array//score and summary information array var arrscore = {score: {chinese:90, maths:100, english:98},            Sunnum: {score:288, num:3}};            serialization of each array var arrnewinfo = $.param (Arrinfo);            var arrnewscore = $.param (Arrscore);            var arrdecscore = decodeuricomponent ($.param (Arrscore));            Displays the serialized array var strtmp = "<b>arrinfo array after serialization </b>:"; Strtmp + = Arrnewinfo;            Results: id=101&name=tao&sex=0 strtmp + = "<br><br><b>arrscore array after serialization </b>:"; Strtmp + = arrnewscore;//results: score%5bchinese%5d=90&score%5bmaths%5d=100&score%5benglish%5d=98&sunnum%            5bscore%5d=288&sunnum%5bnum%5d=3 strtmp + = "<br><br><b>arrscore sequence dissolve code after &LT;/B&GT;:"; Strtmp + = arrdecscore;//results: score[chinese]=90&Amp Score[maths]=100&score[english]=98&sunnum[score]=288&sunnum[num]=3//Display in page $ ("#divTip"        ). append (strtmp); }) </script >

Vi. $.extend--Extension Tool functions

Extended

; (function ($) {            $.extend ({                "test": Function (P1, p2) {                    return p1 && p2;                }})        }) (JQuery);

Call
$.test (True, true);

Vii. $.proxy--Changing the scope of event functions

Two types of formats:
$.proxy (Function,scope): function is the specified event method and scope sets the scope object for the event function.
$.proxy (scope,functionname): Scope is the scope object of the function, functionname is the function name, and it must be a property of the scope object.

<script type= "Text/javascript" >        $ (function () {            var objmyinfo = {              name: "Xiao Zhang",//Set object Name property                sex: " Male ",//Set the Object sex property                Showevent:function () {//Set the execution of the event                    $ (" #divShow "). HTML (" Name: "+                     THIS.name +" <br>< Br> Gender: "+                     this.sex);                }            }            $ ("#Button1"). Bind ("click", Objmyinfo.showevent);//Result: Name: "", Gender: Undefined            $ ("#Button1"). Bind ("click", $. Proxy (Objmyinfo, "showevent")); The event that is set through the proxy function binding. Result: Name: Xiao Zhang, sex: male.            $ ("#Button1"). Bind ("click", $.proxy (Objmyinfo.showevent, Objmyinfo));//Events set through the proxy function binding. Result: Name: Xiao Zhang, sex: male.        })    </script >

Viii. example--detection object type

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Source: http://www.cnblogs.com/janes/
Summary of jquery utility functions