Array operation code in Jquery_jquery-JS Tutorial-php.cn

Array operation code in Jquery_jquery

WBOY

Release： 2016-05-16 18:03:28

Original

1053 people have browsed it

In Jquery, $.map() and $.each() are used to operate arrays:
First is an ordinary array (an array with an index of integers):

Copy code The code is as follows:

 
$.map(arr,fn); 
Call the fn function on each element in the array to process them one by one. , the fn function will process and return the last new array 
var arr = [9, 8, 7, 6, 5, 4, 3, 2, 1]; 
var newarr = $.map(arr , function(item) {return item*2 }); 
alert(newarr); 
$.each(array,fn) calls the fn function to process each element of the array, and there is no return value
 var arr = [9, 8, 7, 6, 5, 4, 3, 2, 1]; 
$.each(arr, function(key, value) { alert("key:" key "value:" value); }); 
 You can also omit the parameters of the function. At this time, this can get the value of the current element traversed 
var arr = [9, 8, 7, 6, 5, 4, 3, 2, 1]; 
$.each(arr, function() { alert(this); }); 

Then there is an array of key-value pairs whose index is a string. For this type of array,
Generally use $.each(array,fn) to operate:
var arr = { "jim": "11", "tom": "12", "lilei": "13" };
$.each(arr, function(key, value) { alert("Name:" key "Age:" value); });
Of course, you can also use a function without parameters to traverse;
When This type of data can be obtained from the server side as follows:
Server side:

Copy code The code is as follows:

 
<%@ WebHandler Language="C#" Class="Handler" %> 
using System; 
using System.Web; 
using System.Web.Script.Serialization; 
using System.Collections.Generic; 
public class Handler : IHttpHandler { 
public void ProcessRequest (HttpContext context) { 
context.Response.ContentType = "text/plain"; 
Person p1 = new Person { Age = "22", Name = "tom" }; 
Person p2 = new Person { Age = "23", Name = "jim" }; 
Person p3 = new Person { Age = "24", Name = "lilei" }; 
IList persons = new List {p1,p2,p3}; 
JavaScriptSerializer js = new JavaScriptSerializer(); 
string s= js.Serialize(persons); 
context.Response.Write(s); 
} 
public class Person 
{ 
public string Name { get; set; } 
public string Age { get; set; } 
} 
public bool IsReusable { 
get { 
return false; 
} 
} 
} 

First instantiate three person objects, then put them into a collection, and finally serialize this collection into a string stream to the client;
Client:
The client passes the background through $.parseJSON() The string is converted into a js array object. Next, we use the method of operating ordinary arrays to operate the obtained array
The third is the Jquery object array obtained through the tag selector,

Copy code The code is as follows:

< /p>

The effect of running in the browser is:
Array operation code in Jquery_jquery

After the dom is loaded, text is dynamically added to each p element , first $("p") obtains the collection of p tags, which is equivalent to document.getElementByTagName in Javascript, except that what is obtained here is an array of Jquery objects, so that Jquery has the inherent implicit iteration function, and the following text(" This is the p tag") operation iterates to each P tag. We can also explicitly call the each function to display the Jquery object array obtained by iteration. The following code can also achieve the above effect:

Copy code The code is as follows: