jQuery 遍历 - map() 方法

来源:http://itssh.cn/post/931.html

定义和用法
map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。
语法
.map(callback(index,domElement))
详细说明
由于返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组

案例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jquery map</title>
<script language="javascript" src="../jquery-1.11.1.js"></script>
<script language="javascript">
    $(function(){
        
        //map 遍历数组
        var str = $.map([1, 2, 3], function(n){
            //console.log(n);
            return n;
        }).join();
        //
        console.log(str);
        
        //
        var data = $('#list li').map(function(){
            //console.log($(this).attr('id'));
            return $(this).attr('id');
        }).get().join();
        
        console.log(data);
    });
</script>
</head>
<body>
    
    <div>
        <ul id="list">
            <li id="li1">列表1</li>
            <li id="li2">列表2</li>
            <li id="li3">列表3</li>
            <li id="li4">列表4</li>
            <li id="li5">列表5</li>
        </ul>
    </div>
    
</body>
</html>

效果:


Paste_Image.png

来源:http://itssh.cn/post/931.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,307评论 19 139
  • 1.JQuery 基础 改变web开发人员创造搞交互性界面的方式。设计者无需花费时间纠缠JS复杂的高级特性。 1....
    LaBaby_阅读 4,897评论 0 1
  • 扫光字是一种比较常见的字体,应用也比较多。在添加影片字幕中应用扫光字可以让视频耳目一新,给观众带来不一样的观影体验...
    louis张璐璐阅读 3,541评论 0 1
  • 《那年花开月正圆》收官后,春杏备受推崇,很多人都喜欢这个忠诚的暖心丫头。在我看来,春杏给我们上了一场生动的职场课。...
    windy天意晚晴阅读 5,883评论 5 33
  • 高中真的让我学到了好多人生哲学知识虽然高中成绩不是特别好,但是班主任的尽职尽责地照顾我们,真的很让我感动,只不过不...
    风的样子阅读 4,702评论 0 0