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 相关文章推荐
关于jquery性能最佳实践的讨论,与求教
Mar 30 Javascript
javascript生成img标签的3种实现方法(对象、方法、html)
Dec 25 Javascript
JS跨域解决方案之使用CORS实现跨域
Apr 14 Javascript
20分钟打造属于你的Bootstrap站点
Jul 27 Javascript
深入浅析jQuery对象$.html
Aug 22 Javascript
微信小程序 LOL 英雄介绍开发实例
Sep 30 Javascript
微信小程序 图片等比例缩放(图片自适应屏幕)
Nov 16 Javascript
提高JavaScript执行效率的23个实用技巧
Mar 01 Javascript
vue2组件实现懒加载浅析
Mar 29 Javascript
vue如何从接口请求数据
Jun 22 Javascript
不使用 JS 匿名函数理由
Nov 17 Javascript
Vue 封装防刷新考试倒计时组件的实现
Jun 05 Javascript
移动端效果之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 whois查询API制作方法
2011/06/23 PHP
关于 Laravel Redis 多个进程同时取队列问题详解
2017/12/25 PHP
PHP获取MySQL执行sql语句的查询时间方法
2018/08/21 PHP
禁止js文件缓存的代码
2010/04/09 Javascript
JS延时器提示框的应用实例代码解析
2016/04/27 Javascript
创建一个类Person的简单实例
2016/05/17 Javascript
js弹出框、对话框、提示框、弹窗实现方法总结(推荐)
2016/05/31 Javascript
原生js实现网页顶部自动下拉/收缩广告效果
2017/01/20 Javascript
JS实现侧边栏鼠标经过弹出框+缓冲效果
2017/03/29 Javascript
JavaScript实现隐藏省略文字效果的方法
2017/04/27 Javascript
关于vue-router的beforeEach无限循环的问题解决
2017/09/09 Javascript
JavaScript命名空间模式实例详解
2019/06/20 Javascript
初步讲解Python中的元组概念
2015/05/21 Python
python 出现SyntaxError: non-keyword arg after keyword arg错误解决办法
2017/02/14 Python
python实现微信自动回复功能
2018/04/11 Python
PyQt5 实现字体大小自适应分辨率的方法
2019/06/18 Python
python元组和字典的内建函数实例详解
2019/10/22 Python
python3 实现口罩抽签的功能
2020/03/11 Python
浅谈python 类方法/静态方法
2020/09/18 Python
Python爬虫设置Cookie解决网站拦截并爬取蚂蚁短租的问题
2021/02/22 Python
CSS3制作酷炫的三维相册效果
2016/07/01 HTML / CSS
CSS3 rgb and rgba(透明色)的使用详解
2020/09/25 HTML / CSS
使用CSS3制作版头动画效果
2020/12/24 HTML / CSS
越南电子产品购物网站:FPT Shop
2017/12/02 全球购物
女士时装鞋:Chinese Laundry
2018/08/29 全球购物
Farfetch阿联酋:奢侈品牌时尚购物平台
2019/07/26 全球购物
当x.equals(y)等于true时,x.hashCode()与y.hashCode()可以不相等,这句话对不对
2015/05/02 面试题
品质管理部岗位职责范文
2014/03/01 职场文书
升旗仪式主持词
2014/03/19 职场文书
《鸟岛》教学反思
2014/04/26 职场文书
物流管理系毕业生求职信
2014/06/03 职场文书
机械设备与数控技术专业求职信
2014/08/10 职场文书
学习礼仪心得体会
2014/09/01 职场文书
python实现图片九宫格分割的示例
2021/04/25 Python
Python获取江苏疫情实时数据及爬虫分析
2021/08/02 Python
Python sklearn分类决策树方法详解
2022/09/23 Python