jQuery元素属性操作实例(设置、获取及删除元素属性)


Posted in Javascript onSeptember 08, 2016

本文实例讲述了jQuery元素属性操作的方法。分享给大家供大家参考,具体如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="js/jquery-1.10.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
$(function(){
  //设置<p>元素的属性'title'
  $("input:eq(0)").click(function(){
    $("p").attr("title","选择你最喜欢的水果.");
  });
  //获取<p>元素的属性'title'
  $("input:eq(1)").click(function(){
    alert( $("p").attr("title") );
  });
  //删除<p>元素的属性'title'
  $("input:eq(2)").click(function(){
    $("p").removeAttr("title");
  });
});
//]]>
</script>
</head>
<body>
<input type="button" value="设置<p>元素的属性'title'"/>
<input type="button" value="获取<p>元素的属性'title'"/>
<input type="button" value="删除<p>元素的属性'title'"/>
<p title="T选择你最喜欢的水果." >你最喜欢的水果是?</p>
<ul>
  <li title='苹果'>苹果</li>
  <li title='橘子'>橘子</li>
  <li title='菠萝'>菠萝</li>
</ul>
</body>
</html>

效果图:

jQuery元素属性操作实例(设置、获取及删除元素属性)

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JQuery 小练习(实例代码)
Aug 07 Javascript
基于JQuery的asp.net树实现代码
Nov 30 Javascript
JS+ACTIVEX实现网页选择本地目录路径对话框
Mar 18 Javascript
JSON辅助格式化处理方法
Mar 26 Javascript
javaScript中的this示例学习详解及工作原理
Jan 13 Javascript
IE8中使用javascript动态加载CSS的解决方法
Jun 17 Javascript
基于js实现微信发送好友如何分享到朋友圈、微博
Nov 30 Javascript
关于js二维数组和多维数组的定义声明(详解)
Oct 02 Javascript
JavaScript数据结构之二叉树的查找算法示例
Apr 13 Javascript
AngularJS实现的JSONP跨域访问数据传输功能详解
Jul 20 Javascript
Vue父子模版传值及组件传值的三种方法
Nov 27 Javascript
layui form表单提交之后重新加载数据表格的方法
Sep 11 Javascript
jquery注册文本框获取焦点清空,失去焦点赋值的简单实例
Sep 08 #Javascript
jQuery常用样式操作实例分析(获取、设置、追加、删除、判断等)
Sep 08 #Javascript
js发送短信倒计时的简单实现方法
Sep 08 #Javascript
JavaScript-html标题滚动效果的简单实现
Sep 08 #Javascript
JS 根据子网掩码,网关计算出所有IP地址范围示例
Apr 23 #Javascript
jQuery遍历节点树方法分析
Sep 08 #Javascript
深入理解AngularJS中的ng-bind-html指令和$sce服务
Sep 08 #Javascript
You might like
excellent!――ASCII Art(由目标图象生成ascii)
2007/02/20 PHP
修改php.ini实现Mysql导入数据库文件最大限制的修改方法
2007/12/11 PHP
怎样去阅读一份php源代码
2009/08/21 PHP
利用Ffmpeg获得flv视频缩略图和视频时间的代码
2011/09/15 PHP
bindParam和bindValue的区别以及在Yii2中的使用详解
2018/03/12 PHP
PHP设计模式之适配器模式定义与用法详解
2018/04/03 PHP
PHP实现财务审核通过后返现金额到客户的功能
2019/07/04 PHP
Javascript 写的简单进度条控件
2008/01/22 Javascript
当jQuery遭遇CoffeeScript的时候 使用分享
2011/09/17 Javascript
关于使用 jBox 对话框的提交不能弹出问题解决方法
2012/11/07 Javascript
jQuery插件Skippr实现焦点图幻灯片特效
2015/04/12 Javascript
纯JavaScript代码实现文本比较工具
2016/02/17 Javascript
JavaScript希尔排序、快速排序、归并排序算法
2016/05/08 Javascript
angularjs项目的页面跳转如何实现(5种方法)
2017/05/25 Javascript
浅谈angular4生命周期钩子
2017/09/05 Javascript
zTree节点文字过多的处理方法
2017/11/24 Javascript
微信小程序开发之转发分享功能
2019/10/22 Javascript
[48:41]VP vs VG Supermajor小组赛 B组胜者组决赛 BO3 第二场 6.2
2018/06/03 DOTA
Python数据类型详解(一)字符串
2016/05/08 Python
使用Python的Flask框架构建大型Web应用程序的结构示例
2016/06/04 Python
Python+django实现简单的文件上传
2016/08/17 Python
django+xadmin+djcelery实现后台管理定时任务
2018/08/14 Python
python实现dijkstra最短路由算法
2019/01/17 Python
python实现不同数据库间数据同步功能
2021/02/25 Python
浅谈Html5移动端ios/Android兼容性总结
2018/06/01 HTML / CSS
早晨薰衣草在线女性精品店:Morning Lavender
2021/01/04 全球购物
附答案的Java面试题
2012/11/19 面试题
PHP引擎php.ini参数优化深入讲解
2021/03/24 PHP
中学生打架检讨书
2014/02/10 职场文书
球队口号
2014/06/18 职场文书
法人委托书
2014/07/31 职场文书
新闻人物通讯稿
2014/10/09 职场文书
家庭教育培训学习心得体会
2016/01/14 职场文书
正则表达式拆分url实例代码
2022/02/24 Java/Android
redis 解决库存并发问题实现数量控制
2022/04/08 Redis
HttpClient实现表单提交上传文件
2022/08/14 Java/Android