1.
1 <%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> 7 <title>操作数组中的各个元素</title> 8 <link rel="stylesheet" href="common.css" type="text/css" /> 9 <script src="jquery-1.5.2.js" type="text/javascript"></script> 10 <script type="text/javascript"> 11 $(document).ready( function() { 12 var members1 = ["Mickey", "Marry", "Lucy"]; 13 /*$.map将一个数组中的元素转换到另一个数组中。 14 * map方法的回调函数包含两个参数,n指向数组中的每个元素,i是每个元素的index,从0开始 15 */ 16 members1 = $.map(members1, function(n, i){ 17 return (i+1+". "+n); 18 }); 19 $("#p1").html(members1.join("<br />")) 20 21 22 //将数组中的各个元素转换为大写再输出 23 var members2 = ["Jim", "Mike", "Lilei"]; 24 members2 = $.map(members2, function(n, i){ 25 return ((i+1)+". "+n.toUpperCase()); 26 }); 27 $("#p2").html(members2.join("<br />")); 28 29 30 //筛选数组中的元素,只显示长度大于或等于4的元素 31 var members3 = ["Jim", "Mike", "Lilei"]; 32 /* 函数用于使用指定的函数过滤数组中的元素,并返回过滤后的数组 33 * grep函数原型为: 34 * grep(array, callback, boolean) 35 * array为待筛选的数组 36 * callback为回调函数,有2个参数,第一个为数组元素,第二个为数组索引(可以省略) 37 * boolean为true时,回调运算为逆向的,比如这个例子则筛选的是长度小于4的元素,可以省略 38 */ 39 members3 = $.grep(members3, function(v){ return v.length>=4 }); 40 $("#p3").html(members3.join("<br />")); 41 42 var members4 = ["Apple", "Orange", "Banana"]; 43 members4 = $.grep(members4, function(v){ return v.match(/an/)}); 44 $("#p4").html(members4.join("<br />")); 45 46 47 }); 48 </script> 49 </head> 50 <body> 51 <h3>Members of my group are: </h3> 52 <p id="p1"></p> 53 <p id="p2"></p> 54 <p id="p3"></p> 55 <p id="p4"></p> 56 </body> 57 </html>