map(callback)方法将jQuery对象中的一组元素转换为jQuery数组中可能包含或不包含元素的另一组值。
您可以使用此方法构建值,属性,css值的列表-甚至执行特殊的,自定义的选择器转换。
selector.map( callback )
这是此方法使用的所有参数的描述-
链接:https://www.learnfk.comhttps://www.learnfk.com/jquery/traversal-map.html
来源:LearnFk无涯教程网
callback - 在集合中的每个元素上执行的函数。
以下是一个简单的示例,简单说明了此方法的用法-
<html> <head> <title>The jQuery Example</title> <script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"> </script> <script type = "text/javascript" language = "javascript"> $(document).ready(function(){ var mappedItems = $("li").map(function (index) { var replacement = $("<li>").text($(this).text()).get(0); if (index == 0) { //make the first item all caps $(replacement).text($(replacement).text().toUpperCase()); } else if (index == 1 || index == 3) { //delete the second and fourth items replacement = null; } else if (index == 2) { //make two of the third item and add some text replacement = [replacement,$("<li>").get(0)]; $(replacement[0]).append("<b> - A</b>"); $(replacement[1]).append("Extra <b> - B</b>"); } //replacement will be an dom element, null, //or an array of dom elements return replacement; }); $("#results").append(mappedItems); }); </script> <style> body { font-size:16px; } ul { float:left; margin:0 30px; color:blue; } #results { color:red; } </style> </head> <body> <ul> <li>First</li> <li>Second</li> <li>Third</li> <li>Fourth</li> <li>Fifth</li> </ul> <ul id = "results"> </ul> </body> </html>
这将产生以下输出-
祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)