把参数直接放到事件定义里面,类似下面这样,也是可以,但是这样不够Nice.

<a href="javascript:void(0)" onclick="clickhandler(arg1)">点击</a> 

上面这种方法有着这样那样的限制,比如在服务器端生成这段代码时,arg1的生成又要用'单引号包裹,如果在客户端视图模板中生成上面这个代码,有可能完全失败,比如在目前的AngualrJS产品版本中。于是乎有了下面这样的做法:

<a href="javascript:void(0)" text="arg1" onclick="clickhandler(event)">点击</a>  

上面这种方法在事件处理函数中的到event的target,再读取属性就可以得到text属性值了,我也记不清楚我从那本书看到的text传参这种做法,同样起相同作用的属性好像也没几个。这种做法有两个问题:1、参数多的情况下,属性不够用;2、text这样的原生属性命名有点糊里糊涂。今天碰到多参传值的情况下,看了一下JS权威指南后面的附录参考,发现在HTML5中专门开辟了这么一个属性集叫data-set,于是乎像下面这样定义:

<a href="javascript:void(0)" data-argname="arg1" onclick="clickhandler(event)">点击</a>

当然还可以定义更多的参数,这个HTML5属性不算高精尖属性,加个HTML5的那个兼容脚本,应该就可以在旧版浏览器上用。

HTML元素的专用传参数据属性的更多相关文章

  1. js设置元素的onclick传参方法

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD ...

  2. Python函数定义及传参方式

    主要内容:     1.函数初识     2.函数传参方式        (1)位置参数        (2)默认参数        (3)关键参数        (4)非固定传参 一.函数初识 1. ...

  3. Angular页面传参的四种方法

    1. 基于ui-router的页面跳转传参 (1)在Angular的app.js中用ui-route定义路由,比如有两个页面, 一个页面(producers.html)放置了多个producers,点 ...

  4. js动态绑定click事件时function传参问题

    今天碰到了这样一个问题,我在javascript中动态创建了一个button, 然后我想给改button添加click事件,绑定的function想要传入一个变量参数, 一开始我想直接通过函数传参传进 ...

  5. js原生方法传参的细节(面试必问)

    废话不说,直接上题. slice(),接收两个参数,第一个为开始index(从0开始),第二个为结束的index(也是从0开始,但是不包括index本身,只到index-1).返回值是截取的数组,原数 ...

  6. Vue 子组件向父组件传参

    直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...

  7. 【转】Sql Server参数化查询之where in和like实现之xml和DataTable传参

    转载至: http://www.cnblogs.com/lzrabbit/archive/2012/04/29/2475427.html 在上一篇Sql Server参数化查询之where in和li ...

  8. Python字符串的修改以及传参

    前两天去面试web developer,面试官提出一个问题,用JavaScript或者Python实现字符串反转,我选择了Python,然后写出了代码(错误的): #!/usr/bin/env pyt ...

  9. Silverlight项目笔记8:层次布局、客户端读取shp、ExecuteCountAsync、柱状图、url传参

    1.层次布局 由于地图窗口和菜单栏都在一个父容器内,在浏览器缩小到一定程度点击地图弹出infoWindow时,会出现菜单栏遮挡infoWindow中间部分的现象,于是通过设置Canvas.ZIndex ...

随机推荐

  1. boost::bad_weak_ptr的原因

    出现boost::bad_weak_ptr最可能的原因是enable_shared_from_this<>类构造函数中调用shared_from_this(), 因为构造尚未完成,实例还没 ...

  2. J2EE学习从菜鸟变大鸟之五 JDBC(Java Data Base Connectivity)

    JDBC刚开始学习这个的时候看到了,以为是ODBC呢,很是相似啊,总的来说还是基本上一类的东东,但是还有一些细微的区别,下面和大家一起分享学习. JDBC(Java Data Base Connect ...

  3. springMVC参数的传递方式(1.通过@PathVariabl获取路径参数,2.@ModelAttribute获取数据,3.HttpServletRequest取参,4@RequestParam)

     通过@PathVariabl注解获取路径中传递参数 JAVA      @RequestMapping(value = "/{id}/{str}")      public  ...

  4. React Native调试心得

    在做React Native开发时,少不了的需要对React Native程序进行调试.调试程序是每一位开发者的基本功,高效的调试不仅能提高开发效率,也能降低Bug率.本文将向大家分享React Na ...

  5. ABB机器人基础培训资料整理与总结

    之前对机械臂了解较少,这方面知识比较匮乏.只使用过PowercCube六自由度机械臂. 感谢ABB公司何老师的耐心指导. 学习资料汇总:(最重要的ABB Robot 官网就不列出了,这里以中文资料为主 ...

  6. 识别你的ADFS是什么版本的(Which version of ADFS is running)

    各版本的ADFS版本识别见如下链接: http://jorgequestforknowledge.wordpress.com/2014/02/23/gathering-architectural-de ...

  7. 内存分配的原理__进程分配内存有两种方式,分别由两个系统调用完成:brk和mmap(不考虑共享内存)

    如何查看进程发生缺页中断的次数? 用ps -o majflt,minflt -C program命令查看. majflt代表major fault,中文名叫大错误,minflt代表minor faul ...

  8. Volley学习小结

    1.概述 volley英文即是"齐射,并发",是谷歌在2013年推出的网络通信库,有如下特点: [1]通信更快,更简单 [2]Get.Post网络请求以及网络数据图像的高效的异步请 ...

  9. 【matlab编程】matlab随机数函数

    Matlab内部函数 a. 基本随机数 Matlab中有两个最基本生成随机数的函数. 1.rand() 生成(0,1)区间上均匀分布的随机变量.基本语法: rand([M,N,P ...]) 生成排列 ...

  10. 【Java编程】Java基本数据类型

    在较前面的一篇博文<C/C++基本数据类型>中,我主要介绍了c/c++的基本数据类型.我们知道C语言没有具体规定各类数据类型所占内存的字节数,只要求long型数据长度不小于int型,sho ...