jQuery中map()方法用法实例


Posted in Javascript onJanuary 06, 2015

本文实例讲述了jQuery中map()方法用法。分享给大家供大家参考。具体分析如下:

此方法将一组元素转换成其他数组(不论是否是元素数组)。
可以用这个函数来建立一个列表,不论是值、属性还是CSS样式,或者其他特别形式。
语法结构:

$("selector").map(function)

参数列表:

参数 描述
function 给每个元素执行的函数

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("p").append($("input").map(function(){ 

    return $(this).val();

  }).get().join(", ")); 

}) 

</script>

</head>

<body>

<div>

  <p>值:</p>

  <form>

    <input type="text" name="name" value="脚本无忧"/>

    <input type="text" name="password" value="123456"/>

    <input type="text" name="url" value="https://3water.com"/>

  </form>

</div>

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
Jun 09 Javascript
JavaScript创建对象的写法
Aug 29 Javascript
实例说明为什么不要行内使用javascript
Apr 18 Javascript
javascript实时显示当天日期的方法
May 20 Javascript
原生js实现class的添加和删除简单代码
Jul 12 Javascript
ionic由于使用了header和subheader导致被遮挡的问题的两种解决方法
Sep 22 Javascript
jQuery插件FusionCharts实现的MSBar3D图效果示例【附demo源码】
Mar 23 jQuery
JavaScript订单操作小程序完整版
Jun 23 Javascript
解决canvas画布使用fillRect()时高度出现双倍效果的问题
Aug 03 Javascript
Vue2.2.0+新特性整理及注意事项
Aug 22 Javascript
JavaScript设计模式之责任链模式实例分析
Jan 16 Javascript
Taro小程序自定义顶部导航栏功能的实现
Dec 17 Javascript
jQuery中is()方法用法实例
Jan 06 #Javascript
JavaScript中document对象使用详解
Jan 06 #Javascript
jQuery中Form相关知识汇总
Jan 06 #Javascript
使用VS开发 Node.js指南
Jan 06 #Javascript
jQuery实现的图片分组切换焦点图插件
Jan 06 #Javascript
JavaScript静态类型检查工具FLOW简介
Jan 06 #Javascript
jQuery中filter()方法用法实例
Jan 06 #Javascript
You might like
在php和MySql中计算时间差的方法
2011/04/22 PHP
set_include_path和get_include_path使用及注意事项
2013/02/02 PHP
PHP中copy on write写时复制机制介绍
2014/05/13 PHP
PHP函数引用返回的实例详解
2016/09/11 PHP
php+mysql查询实现无限下级分类树输出示例
2016/10/03 PHP
jQuery unbind()方法实例详解
2016/01/19 Javascript
Vue.js使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用
2017/05/10 Javascript
vue-cli构建项目下使用微信分享功能
2018/05/28 Javascript
利用js将ajax获取到的后台数据动态加载至网页中的方法
2018/08/08 Javascript
浅谈webpack4.x 入门(一篇足矣)
2018/09/05 Javascript
Vue cli3 库模式搭建组件库并发布到 npm的流程
2018/10/12 Javascript
JS解惑之Object中的key是有序的么
2019/05/06 Javascript
简单了解Javscript中兄弟ifream的方法调用
2019/06/17 Javascript
MockJs结合json-server模拟后台数据
2020/08/26 Javascript
JS实现的tab切换并显示相应内容模块功能示例
2019/08/03 Javascript
javascript头像上传代码实例
2019/09/28 Javascript
微信小程序实现弹框效果
2020/05/26 Javascript
python文件与目录操作实例详解
2016/02/22 Python
python处理html转义字符的方法详解
2016/07/01 Python
浅谈python 里面的单下划线与双下划线的区别
2017/12/01 Python
Python实现的多项式拟合功能示例【基于matplotlib】
2018/05/15 Python
python实现遍历文件夹修改文件后缀
2018/08/28 Python
详解python3 + Scrapy爬虫学习之创建项目
2019/04/12 Python
Python操作Sonqube API获取检测结果并打印过程解析
2019/11/27 Python
python 利用jieba.analyse进行 关键词提取
2020/12/17 Python
CSS3的新特性介绍
2008/10/31 HTML / CSS
CSS3教程(5):网页背景图片
2009/04/02 HTML / CSS
Html5新特性用canvas标签画多条直线附效果截图
2014/06/30 HTML / CSS
戴尔马来西亚官网:Dell Malaysia
2020/05/02 全球购物
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
数控技术专业毕业自荐书范文
2014/02/05 职场文书
售后服务承诺书范文
2014/03/26 职场文书
红领巾心向党演讲稿
2014/09/10 职场文书
表扬稿格式范文
2015/01/16 职场文书
人民调解协议书
2016/03/21 职场文书
Docker部署Mysql8的实现步骤
2022/07/07 Servers