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 相关文章推荐
点击页面其它地方隐藏该div的两种思路
Nov 18 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
Aug 05 Javascript
理解javascript定时器中的单线程
Feb 23 Javascript
jQuery简单实现页面元素置顶时悬浮效果示例
Aug 01 Javascript
vue实现添加标签demo示例代码
Jan 21 Javascript
React学习笔记之列表渲染示例详解
Aug 22 Javascript
微信小程序使用Socket的实例
Sep 19 Javascript
详解vue移动端日期选择组件
Feb 22 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
Jun 24 Javascript
详解JavaScript事件循环机制
Sep 07 Javascript
vue中改变滚动条样式的方法
Mar 03 Javascript
Vue切换Tab动态渲染组件的操作
Sep 21 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实现文件下载功能的几个代码分享
2014/05/10 PHP
WordPress特定文章对搜索引擎隐藏或只允许搜索引擎查看
2015/12/31 PHP
PHP针对字符串开头和结尾的判断方法
2016/07/11 PHP
JavaScript去除空格的三种方法(正则/传参函数/trim)
2013/02/06 Javascript
jquery scrollTop方法根据滚动像素显示隐藏顶部导航条
2013/05/27 Javascript
javascript中的=等号个数问题两个跟三个有什么区别
2013/10/23 Javascript
jquery的父子兄弟节点查找示例代码
2014/03/03 Javascript
jquery实现带缩略图的全屏图片画廊效果实例
2015/06/25 Javascript
js中使用使用原型(prototype)定义方法的好处详解
2016/07/04 Javascript
详解堆的javascript实现方法
2016/11/29 Javascript
JavaScript轮播图简单制作方法
2017/02/20 Javascript
详解如何在vue中使用sass
2017/06/21 Javascript
JavaScript门面模式详解
2017/10/19 Javascript
如何为vuex实现带参数的 getter和state.commit
2019/01/04 Javascript
CKeditor4 字体颜色功能配置方法教程
2019/06/26 Javascript
在微信小程序中使用mqtt服务的方法
2019/12/13 Javascript
关于引入vue.js 文件的知识点总结
2020/01/28 Javascript
基于vue--key值的特殊用处详解
2020/07/31 Javascript
element 动态合并表格的步骤
2020/12/31 Javascript
python中urllib模块用法实例详解
2014/11/19 Python
Python中shutil模块的常用文件操作函数用法示例
2016/07/05 Python
python检查URL是否正常访问的小技巧
2017/02/25 Python
Python如何快速上手? 快速掌握一门新语言的方法
2017/11/14 Python
火车票抢票python代码公开揭秘!
2018/03/08 Python
python和pygame实现简单俄罗斯方块游戏
2021/02/19 Python
python实现抽奖小程序
2020/04/15 Python
Jmeter HTTPS接口测试证书导入过程图解
2020/07/22 Python
linux面试题参考答案(2)
2015/12/06 面试题
与C++相比,Java中的数组有什么不同
2014/03/25 面试题
党员个人思想汇报
2013/12/28 职场文书
高中体育教学反思
2014/01/29 职场文书
个人实习生的自我评价
2014/02/16 职场文书
反腐倡廉演讲稿
2014/05/22 职场文书
励志演讲稿800字
2014/08/21 职场文书
nginx网站服务如何配置防盗链(推荐)
2021/03/31 Servers
React 高阶组件HOC用法归纳
2021/06/13 Javascript