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>

 

posted on 2017-01-17 23:05  Sharpest  阅读(235)  评论(0编辑  收藏  举报