JS和jQuery通过this获取html标签中的属性值(实例代码)


Posted in jQuery onSeptember 11, 2017

废话不多说了,具体代码如下所示:

<html>
 <head>
  <script type="text/javascript" src="jquery-1.10.2.min.js"></script>
  <script type="text/javascript">
   /** JQUERY 通过当前标签属性名,获取属性的值 */
   function attrsByJquery(obj){
    var v1 = $(obj).attr("dbname");
    var v2 = $(obj).attr("name");
    alert(v1);
    alert(v2);
   }
   
   /** JAVASCRIPT 通过当前标签属性名,获取属性的值 */
   function attrsByJs(obj){
    var v1 = obj.getAttribute('name');
    var v2 = obj.getAttribute('dbname');
    alert(v1);
    alert(v2);
   }
   
   function attrsButtons(obj){
    var v = obj.getAttribute('name');
    var vv = $(obj).attr("myname");
    alert(v);
    alert(vv);
   }
   
  </script>
 </head>
 <body>
  <div>
   <div style="width: 100px;height: 30px;float:left; margin-left:30px;" name="this is name feild" dbname="oracle1" onclick="attrsByJs(this)">JavaScript</div>
   <div style="width: 100px;height: 30px;float:left; margin-left:30px;" name="this is name feild" dbname="oracle2" onclick="attrsByJquery(this)">Juqery</div>
   <input type="button" name="abcdeg" myname="this is my name" onclick="attrsButtons(this)" value="buttons">
  </div>
 </body>
</html>

总结

以上所述是小编给大家介绍的JS和jQuery通过this获取html标签中的属性值,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery日程管理控件glDatePicker用法详解
Mar 29 jQuery
jQuery自定义元素右键点击事件(实现案例)
Apr 28 jQuery
jQuery实现frame之间互通的方法
Jun 26 jQuery
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 jQuery
解决html-jquery/js引用外部图片时遇到看不了或出现403的问题
Sep 22 jQuery
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
jquery实现搜索框功能实例详解
Jul 23 jQuery
jQuery常见的遍历DOM操作详解
Sep 05 jQuery
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 jQuery
jQuery简单实现根据日期计算星期几的方法
Jan 09 jQuery
jQuery实现视频展示效果
May 30 jQuery
JavaScript枚举选择jquery插件代码实例
Nov 17 jQuery
利用JQuery操作iframe父页面、子页面的元素和方法汇总
Sep 10 #jQuery
jQuery事件对象的属性和方法详解
Sep 09 #jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 #jQuery
jQuery选择器中的特殊符号处理方法
Sep 08 #jQuery
JQuery 获取多个select标签option的text内容(实例)
Sep 07 #jQuery
jQuery UI Draggable + Sortable 结合使用(实例讲解)
Sep 07 #jQuery
jQueryUI Sortable 应用Demo(分享)
Sep 07 #jQuery
You might like
php将服务端的文件读出来显示在web页面实例
2016/10/31 PHP
IOS 开发之NSDictionary转换成JSON字符串
2017/08/14 PHP
比较简单的一个符合web标准的JS调用flash方法
2007/11/29 Javascript
Ext 表单布局实例代码
2009/04/30 Javascript
JavaScript 大数据相加的问题
2011/08/03 Javascript
ExtJS中文乱码之GBK格式编码解决方案及代码
2013/01/20 Javascript
JavaScript子类用Object.getPrototypeOf去调用父类方法解析
2013/12/05 Javascript
jQuery实现根据类型自动显示和隐藏表单
2015/03/18 Javascript
IE6-IE9使用JSON、table.innerHTML所引发的问题
2015/12/22 Javascript
javascript求日期差的方法
2016/03/02 Javascript
jQuery插件FusionCharts实现的3D柱状图效果实例【附demo源码下载】
2017/03/03 Javascript
vue :src 文件路径错误问题的解决方法
2018/05/15 Javascript
.vue文件 加scoped 样式不起作用的解决方法
2018/05/28 Javascript
node.js调用C++函数的方法示例
2018/09/21 Javascript
搭建一个Koa后端项目脚手架的方法步骤
2019/05/30 Javascript
解决layui laydate 时间控件一闪而过的问题
2019/09/28 Javascript
JS实现TITLE悬停长久显示效果完整示例
2020/02/11 Javascript
vue切换菜单取消未完成接口请求的案例
2020/11/13 Javascript
[56:45]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第一局
2016/02/28 DOTA
简单掌握Python的Collections模块中counter结构的用法
2016/07/07 Python
用python的requests第三方模块抓取王者荣耀所有英雄的皮肤实例
2017/12/14 Python
ubuntu系统下使用pm2设置nodejs开机自启动的方法
2018/05/12 NodeJs
python 多线程将大文件分开下载后在合并的实例
2018/11/09 Python
Python 装饰器@,对函数进行功能扩展操作示例【开闭原则】
2019/10/17 Python
采用怎样的方法保证数据的完整性
2013/12/02 面试题
毕业生自荐信的主要内容
2013/10/29 职场文书
初中家长寄语
2014/04/02 职场文书
员工生日会策划方案
2014/06/14 职场文书
民主生活会主持词
2015/07/01 职场文书
践行三严三实心得体会(2016推荐篇)
2016/01/06 职场文书
小学英语听课心得体会
2016/01/14 职场文书
小学教师教学反思
2016/02/24 职场文书
2016优秀员工先进事迹材料
2016/02/25 职场文书
nginx部署多前端项目的几种方法
2021/05/25 Servers
浅谈Java父子类加载顺序
2021/08/04 Java/Android
Win Server2016远程桌面如何允许多用户同时登录
2022/06/10 Servers