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 Ext JS 状态默认存储时间
Feb 15 Javascript
JS实现图片产生波纹一样flash效果的方法
Feb 27 Javascript
JQuery CheckBox(复选框)操作方法汇总
Apr 15 Javascript
jQuery实现的仿百度分页足迹效果代码
Oct 30 Javascript
老生常谈JavaScript数组的用法
Jun 10 Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
Jan 04 Javascript
深入理解JavaScript 参数按值传递
May 24 Javascript
手写Node静态资源服务器的实现方法
Mar 20 Javascript
35个最好用的Vue开源库(史上最全)
Jan 03 Javascript
JavaScript中使用Spread运算符的八种方法总结
Jun 18 Javascript
在vue中配置不同的代理同时访问不同的后台操作
Sep 11 Javascript
Openlayers3实现车辆轨迹回放功能
Sep 29 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
相对路径转化成绝对路径
2007/04/10 PHP
php开发工具之vs2005图解
2008/01/12 PHP
php REMOTE_ADDR之获取访客IP的代码
2008/04/22 PHP
PHP远程连接MYSQL数据库非常慢的解决方法
2008/07/05 PHP
Php Mssql操作简单封装支持存储过程
2009/12/11 PHP
php发送post请求的三种方法
2014/02/11 PHP
Yii框架连接mongodb数据库的代码
2016/07/27 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
php处理静态页面:页面设置缓存时间实例
2017/06/22 PHP
PHP的new static和new self的区别与使用
2019/11/27 PHP
dojo 之基础篇
2007/03/24 Javascript
js中获取事件对象的方法小结
2011/03/13 Javascript
javascript 数字格式化输出的实现代码
2013/12/10 Javascript
jQuery通过点击行来删除HTML表格行的实现示例
2014/09/10 Javascript
JavaScript中document对象使用详解
2015/01/06 Javascript
jquery UI Datepicker时间控件的使用及问题解决
2016/04/28 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
2017/10/26 Javascript
基于node简单实现RSA加解密的方法步骤
2019/03/21 Javascript
javascript合并两个数组最简单的实现方法
2019/09/14 Javascript
解决Vue.js应用回退或刷新界面时提示用户保存修改问题
2019/11/24 Javascript
javascript实现前端input密码输入强度验证
2020/06/24 Javascript
JavaScript 获取滚动条位置并将页面滑动到锚点
2021/02/08 Javascript
Python通过matplotlib绘制动画简单实例
2017/12/13 Python
谈一谈数组拼接tf.concat()和np.concatenate()的区别
2020/02/07 Python
Pycharm pyuic5实现将ui文件转为py文件,让UI界面成功显示
2020/04/08 Python
3种适用于Python的疯狂秘密武器及原因解析
2020/04/29 Python
Html5之svg可缩放矢量图形_动力节点Java学院整理
2017/07/17 HTML / CSS
英国设计的甲板鞋和船鞋:Chatham
2018/12/06 全球购物
真正的英国宝藏:Mappin & Webb
2019/05/05 全球购物
斯洛伐克最大的婴儿食品和用品网上商店:Feedo.sk
2020/12/21 全球购物
在数据文件自动增长时,自动增长是否会阻塞对文件的更新
2014/05/01 面试题
个人总结与自我评价
2015/02/14 职场文书
广告公司文案策划岗位职责
2015/04/14 职场文书
python 中yaml文件用法大全
2021/07/04 Python
浅谈mysql哪些情况会导致索引失效
2021/11/20 MySQL
浅谈JavaScript作用域
2021/12/06 Javascript