JQuery

How to iterationg and modifying array with jQuery.map ?

How to iterationg and modifying array with jQuery.map ?, someone asked me to explain?

In this article we will learn how to iterationg and modifying array with jQuery.map. We can loop each element in the array and modify the value.$.map(). The $.map() method will takes the array and callback method as argument, while iterating using substring we are taking first 3 letters.

Example:

 

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>month abbrevation with jQuery.map</title>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var months = ['January', 'February', 'March', 'April', 'May',
          'June', 'July', 'August', 'September', 'October',
          'November', 'December'];
            months = $.map(months, function (value, i) {
                return "abbrevation for the month of " + value + " is <b style='color:black'>" + value.substr(0, 3) + "</b>";
            });
            $('#divResult').html("<li >" + months.join("</li><li>") + "</li>");
        });
    </script>
    <style type="text/css">
        div {
            display: inline-block;
            float: left;
            color: #fff;
            font-size: 18px;
            padding-left: 5px;
            text-align:center;
        }
         .content {
            width: 450px;
            height: 250px;
            background: purple;
        }
    </style>
</head>
<body>
    <div class="content" id="divResult"></div>
</body>
</html> 

Output:

iterationg and modifying array with jQuery map

Post your comments / questions