jquery对把数组装进集合，并且大写，过滤数组中的元素

 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 阅读(240) 评论(0) 收藏举报