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 在网页中的运用(asp.net)
Nov 23 Javascript
ExtJs扩展之GroupPropertyGrid代码
Mar 05 Javascript
JS 实现获取打开一个界面中输入的值
Mar 19 Javascript
js修改input的type属性问题探讨
Oct 12 Javascript
ff下JQuery无法监听input的keyup事件的解决方法
Dec 12 Javascript
js实现鼠标感应图片展示的方法
Feb 27 Javascript
js中作用域的实例解析
Mar 16 Javascript
JavaScript使用math.js进行精确计算操作示例
Jun 19 Javascript
Vue.js实现双向数据绑定方法(表单自动赋值、表单自动取值)
Aug 27 Javascript
Vue 实例事件简单示例
Sep 19 Javascript
jQuery实现的分页插件完整示例
May 26 jQuery
js基础语法与maven项目配置教程案例
Jul 15 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新手上路(十二)
2006/10/09 PHP
php中将时间差转换为字符串提示的实现代码
2011/08/08 PHP
探讨fckeditor在Php中的配置详解
2013/06/08 PHP
php字符串截取函数用法分析
2014/11/25 PHP
PHP实现简单实用的验证码类
2015/07/29 PHP
[原创]php使用strpos判断字符串中数字类型子字符串出错的解决方法
2017/04/01 PHP
JavaScript修改css样式style
2008/04/15 Javascript
基于jQuery的图片大小自动适应实现代码
2010/11/17 Javascript
javascript中怎么做对象的类型判断
2013/11/11 Javascript
JavaScript是如何实现继承的(六种方式)
2016/03/31 Javascript
微信小程序使用第三方库Immutable.js实例详解
2016/09/27 Javascript
jquery 动态增加删除行的简单实例(推荐)
2016/10/12 Javascript
微信小程序  网络请求API详解
2016/10/25 Javascript
angular实现商品筛选功能
2017/02/01 Javascript
jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】
2017/03/03 Javascript
Node.js中.pfx后缀文件的处理方法
2017/03/10 Javascript
webpack打包多页面的方法
2018/11/30 Javascript
Vue Autocomplete 自动完成功能简单示例
2019/05/25 Javascript
ionic2.0双击返回键退出应用
2019/09/17 Javascript
Python基础入门之seed()方法的使用
2015/05/15 Python
Python设计模式之策略模式实例详解
2019/01/21 Python
使用python分析统计自己微信朋友的信息
2019/07/19 Python
python通过txt文件批量安装依赖包的实现步骤
2019/08/13 Python
python自动点赞功能的实现思路
2020/02/26 Python
python3注册全局热键的实现
2020/03/22 Python
Spring http服务远程调用实现过程解析
2020/06/11 Python
改变 Python 中线程执行顺序的方法
2020/09/24 Python
Python3.9.0 a1安装pygame出错解决全过程(小结)
2021/02/02 Python
Opencv 图片的OCR识别的实战示例
2021/03/02 Python
波兰在线运动商店:YesSport
2020/07/23 全球购物
西安夏日科技有限公司Java笔试题
2013/01/11 面试题
企业党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
2015年学校政教工作总结
2015/07/20 职场文书
副校长2015年教育教学工作总结
2015/07/27 职场文书
七年级作文之雪景
2019/11/18 职场文书
Go归并排序算法的实现方法
2022/04/06 Golang