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 相关文章推荐
Uglifyjs(JS代码优化工具)入门 安装使用
Apr 13 Javascript
用javascript为页面添加天气显示实现思路及代码
Dec 02 Javascript
jquery统计输入文字的个数并对其进行判断
Jan 07 Javascript
js调试系列 控制台命令行API使用方法
Jun 18 Javascript
深入浅析JavaScript中对事件的三种监听方式
Sep 29 Javascript
jquery实现全屏滚动
Dec 28 Javascript
AngularJS实现动态编译添加到dom中的方法
Nov 04 Javascript
jQuery向webApi提交post json数据
Jan 16 Javascript
JS实现的走迷宫小游戏完整实例
Jul 19 Javascript
微信小程序实现收藏与取消收藏切换图片功能
Aug 03 Javascript
vue项目中使用Svg的方法
Oct 24 Javascript
Html5生成验证码的示例代码
May 10 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面向对象法则
2012/02/23 PHP
PHP中ob_start函数的使用说明
2013/11/11 PHP
PHP实现微信发红包程序
2015/08/24 PHP
thinkPHP使用pclzip打包备份mysql数据库的方法
2016/04/30 PHP
PHP递归删除多维数组中的某个值
2017/04/17 PHP
PHP流Streams、包装器wrapper概念与用法实例详解
2017/11/17 PHP
不同浏览器对回车提交表单的处理办法
2010/02/13 Javascript
读jQuery之十 事件模块概述
2011/06/27 Javascript
基于jquery的防止大图片撑破页面的实现代码(立即缩放)
2011/10/24 Javascript
常见JS效果之图片减速度滚动实现代码
2011/12/08 Javascript
wap手机图片滑动切换特效无css3元素js脚本编写
2014/07/28 Javascript
sogou地图API用法实例教程
2014/09/11 Javascript
JavaScript处理解析JSON数据过程详解
2015/09/11 Javascript
javascript实现的登陆遮罩效果汇总
2015/11/09 Javascript
JavaScript实现的SHA-1加密算法完整实例
2016/02/02 Javascript
node实现基于token的身份验证
2018/04/09 Javascript
JavaScript实现无限级递归树的示例代码
2019/03/29 Javascript
微信小程序登陆注册功能的实现代码
2019/12/10 Javascript
JavaScript数组排序的六种常见算法总结
2020/08/18 Javascript
[13:18]《一刀刀一天》之DOTA全时刻21:详解TI新赛制 A队再露獠牙
2014/06/24 DOTA
使用python获取CPU和内存信息的思路与实现(linux系统)
2014/01/03 Python
Python Tkinter基础控件用法
2014/09/03 Python
基于进程内通讯的python聊天室实现方法
2015/06/28 Python
PYQT5设置textEdit自动滚屏的方法
2019/06/14 Python
Python 实现微信自动回复的方法
2020/09/11 Python
CSS3实现swap交换动画
2016/01/19 HTML / CSS
linux下进程间通信的方式
2014/12/23 面试题
电厂职工自我鉴定
2014/02/20 职场文书
德语专业求职信
2014/03/12 职场文书
网络工程专业自荐信范文
2014/03/16 职场文书
营销团队口号
2014/06/06 职场文书
优秀团队申报材料
2014/12/26 职场文书
停课通知书
2015/04/24 职场文书
教你用Java Swing实现自助取款机系统
2021/06/11 Java/Android
Java循环队列与非循环队列的区别总结
2021/06/22 Java/Android
Nginx配置之实现多台服务器负载均衡
2021/08/02 Servers