JS中Attr的用法详解


Posted in Javascript onOctober 09, 2017

具体代码如下所示:

<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $("#btn").click(function(){
      //使用attr(name)获取属性值:
      alert($("p").attr("title"));//你最喜欢的水果是。
      alert($("ul li:eq(1)").attr("title"));//橘子汁
      alert($("ul li:eq(1)").attr("alt"));//123
      //使用attr(name, value)改变属性值:
      //$("ul li:eq(1)").attr("title", "还是吗?");//将第二个li的title的值改变
      //使用attr(name, fn)设置属性的函数值
      $("ul li:eq(1)").attr("title", function(){
          return "我就不信";
      });//将第二个li的title的值改变
      alert($("ul li:eq(1)").attr("title"));//我就不信
      //使用attr(name, properties)将一个“名/值”形式的对象设置为所有匹配元素的属性
      $("ul li:eq(1)").attr({title: "第一个", alt: "第二个"});
      alert($("ul li:eq(1)").attr("title"));//第一个
      alert($("ul li:eq(1)").attr("alt"));//第二个
    });
  });
</script>
<p title="你最喜欢的水果是。">你最喜欢的水果是?</p>
<ul>
  <li title="苹果汁">苹果</li>
  <li title="橘子汁" name="好吃" alt="123">橘子</li>
  <li title="菠萝汁">菠萝</li>
</ul>
<input type="button" value="点击" id="btn"/>

总结

以上所述是小编给大家介绍的JS中Attr的用法详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript高级程序设计(第3版)学习笔记11 内建js对象
Oct 11 Javascript
Jquery中Event对象属性小结
Feb 27 Javascript
AngularJS基础学习笔记之指令
May 10 Javascript
jquery判断复选框选中状态以及区分attr和prop
Dec 18 Javascript
又一枚精彩的弹幕效果jQuery实现
Jul 25 Javascript
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
Apr 01 Javascript
JS实现根据详细地址获取经纬度功能示例
Apr 16 Javascript
vue-cli3 配置开发与测试环境详解
May 17 Javascript
layui数据表格重载实现往后台传参
Nov 15 Javascript
JavaScript实现简单的弹窗效果
May 19 Javascript
微信小程序canvas实现签名功能
Jan 19 Javascript
vue.js Router中嵌套路由的实用示例
Jun 27 Vue.js
移动端效果之Swiper详解
Oct 09 #Javascript
浅谈node的事件机制
Oct 09 #Javascript
JS实现中文汉字按拼音排序的方法
Oct 09 #Javascript
ES6中的Promise代码详解
Oct 09 #Javascript
js+html5生成自动排列对话框实例
Oct 09 #Javascript
jQuery实现获取table中鼠标click点击位置行号与列号的方法
Oct 09 #jQuery
详解如何让Express支持async/await
Oct 09 #Javascript
You might like
PHP的FTP学习(二)[转自奥索]
2006/10/09 PHP
服务器web工具 php环境下
2010/12/29 PHP
PHP 之Section与Cookie使用总结
2012/09/14 PHP
一个漂亮的php验证码类(分享)
2013/08/06 PHP
JavaScript 存在陷阱 删除某一区域所有节点
2010/05/10 Javascript
浅析LigerUi开发中谨慎载入common.css文件
2013/07/09 Javascript
js数值和和字符串进行转换时可以对不同进制进行操作
2014/03/05 Javascript
javascript实现动态模态绑定grid过程代码
2014/09/22 Javascript
Node.js的包详细介绍
2015/01/14 Javascript
js限制input标签中只能输入中文
2015/06/26 Javascript
js添加千分位的实现代码(超简单)
2016/08/01 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
2016/12/08 Javascript
微信小程序实现翻牌抽奖动画
2020/09/21 Javascript
[02:39]DOTA2英雄基础教程 极限穿梭编织者
2013/12/05 DOTA
python中私有函数调用方法解密
2016/04/29 Python
基于python实现高速视频传输程序
2019/05/05 Python
python如何从文件读取数据及解析
2019/09/19 Python
Django 项目通过加载不同env文件来区分不同环境
2020/02/17 Python
keras得到每层的系数方式
2020/06/15 Python
真正了解CSS3背景下的@font face规则
2017/05/04 HTML / CSS
基于DOM+CSS3实现OrgChart组织结构图插件
2016/03/02 HTML / CSS
html5本地存储 localStorage操作使用详解
2016/09/20 HTML / CSS
中国领先的专业演出票务网:永乐票务
2016/08/29 全球购物
StubHub意大利:购买和出售全球演唱会和体育赛事门票
2017/11/21 全球购物
Petmate品牌官方网站:宠物用品
2018/11/25 全球购物
台湾家适得:Homeget
2019/02/11 全球购物
AOP的定义以及作用
2013/09/08 面试题
计算机科学与技术应届生求职信
2013/11/07 职场文书
青岛海底世界导游词
2015/02/11 职场文书
银行优秀员工推荐信
2015/03/24 职场文书
2015年工程部工作总结
2015/04/30 职场文书
新闻简讯格式及范文
2015/07/22 职场文书
2019年暑期法院实习报告
2019/12/18 职场文书
ORACLE查看当前账号的相关信息
2021/06/18 Oracle
分析Java中Map的遍历性能问题
2021/06/26 Java/Android
java后台调用接口及处理跨域问题的解决
2022/03/24 Java/Android