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实现节点的追加、替换、删除、复制功能示例
Jul 11 jQuery
jQuery实现上传图片前预览效果功能
Aug 03 jQuery
jquery实现限制textarea输入字数的方法
Sep 06 jQuery
jQuery实现用户信息表格的添加和删除功能
Sep 12 jQuery
jquery中done和then的区别(详解)
Dec 19 jQuery
jQuery实现左右滑动的toggle方法
Mar 03 jQuery
jQuery实现的手动拖动控制进度条效果示例【测试可用】
Apr 18 jQuery
jquery ui 实现 tab标签功能示例【测试可用】
Jul 25 jQuery
9种方法优化jQuery代码详解
Feb 04 jQuery
Jquery高级应用Deferred对象原理及使用实例
May 28 jQuery
基于jQuery拖拽事件的封装
Nov 29 jQuery
jQuery class属性操作addClass()与removeClass()、hasClass()、toggleClass()
Mar 31 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
无线电的诞生过程
2021/03/01 无线电
Mysql的GROUP_CONCAT()函数使用方法
2008/03/28 PHP
php在多维数组中根据键名快速查询其父键以及父键值的代码
2011/05/07 PHP
Session保存到数据库的php类分享
2011/10/24 PHP
php实现的后台表格分页功能示例
2017/10/23 PHP
JQuery 动画卷页 返回顶部 动画特效(兼容Chrome)
2010/02/15 Javascript
利用JS重写Cognos右键菜单的实现代码
2010/04/11 Javascript
基于jquery的表格排序
2010/09/11 Javascript
js onclick事件传参讲解
2013/11/06 Javascript
基于jQuery和Bootstrap框架实现仿知乎前端动态列表效果
2016/11/09 Javascript
canvas绘制多边形
2017/02/24 Javascript
[js高手之路]设计模式系列课程-发布者,订阅者重构购物车的实例
2017/08/29 Javascript
jQuery实现注册会员时密码强度提示信息功能示例
2017/09/05 jQuery
使用Angular CLI生成 Angular 5项目教程详解
2018/03/18 Javascript
vue+element模态框中新增模态框和删除功能
2019/06/11 Javascript
node中实现删除目录的几种方法
2019/06/24 Javascript
vue动态禁用控件绑定disable的例子
2019/10/28 Javascript
vue实现购物车案例
2020/05/30 Javascript
Vue——解决报错 Computed property &quot;****&quot; was assigned to but it has no setter.
2020/12/19 Vue.js
Python入门篇之对象类型
2014/10/17 Python
Python简单调用MySQL存储过程并获得返回值的方法
2015/07/20 Python
Python 查找list中的某个元素的所有的下标方法
2018/06/27 Python
python中csv文件的若干读写方法小结
2018/07/04 Python
Python基本语法之运算符功能与用法详解
2019/10/22 Python
卸载tensorflow-cpu重装tensorflow-gpu操作
2020/06/23 Python
python爬虫分布式获取数据的实例方法
2020/11/26 Python
现场施工员岗位职责
2014/03/10 职场文书
环境监测与治理技术专业求职信
2014/07/06 职场文书
社区党员群众路线教育实践活动心得体会
2014/11/03 职场文书
爱心捐助活动总结
2015/05/09 职场文书
基层组织建设年活动总结
2015/05/09 职场文书
2016年“六一儿童节”校园广播稿
2015/12/17 职场文书
小学三年级数学教学反思
2016/02/16 职场文书
html5实现点击弹出图片功能
2021/07/16 HTML / CSS
Win11应用商店打开闪退怎么解决? win11应用商店打不开的多种解决办法
2022/04/05 数码科技
Win11 21h2可以升级22h2吗?看看你的电脑符不符合要求
2022/07/07 数码科技