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实现的一个文章自定义分段显示功能
May 23 Javascript
checkbox选中与未选中判断示例
Aug 04 Javascript
JS实现从顶部下拉显示的带动画QQ客服特效代码
Oct 24 Javascript
几种二级联动案例(jQuery\Array\Ajax php)
Aug 13 Javascript
jQuery实现简单的网页换肤效果示例
Sep 18 Javascript
jQuery实现根据生日计算年龄 星座 生肖
Nov 23 Javascript
详解windows下vue-cli及webpack 构建网站(三)使用组件
Jun 17 Javascript
在 Node.js 中使用原生 ES 模块方法解析
Sep 19 Javascript
p5.js 毕达哥拉斯树的实现代码
Mar 23 Javascript
JavaScript 判断iPhone X Series机型的方法
Jan 28 Javascript
layui自己添加图片按钮并点击跳转页面的例子
Sep 14 Javascript
Vue Element校验validate的实例
Sep 21 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
PHP反射类ReflectionClass和ReflectionObject的使用方法
2013/11/13 PHP
php不使用插件导出excel的简单方法
2014/03/04 PHP
yii2.0之GridView自定义按钮和链接用法
2014/12/15 PHP
golang与PHP输出excel示例
2016/07/22 PHP
静态html文件执行php语句的方法(推荐)
2016/11/21 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
jQuery中first()方法用法实例
2015/01/06 Javascript
JavaScript通过字符串调用函数的实现方法
2015/03/18 Javascript
jquery实现清新实用的网页菜单效果
2015/08/28 Javascript
javascript Slip.js实现整屏滑动的手机网页
2015/11/25 Javascript
jQuery flip插件实现的翻牌效果示例【附demo源码下载】
2016/09/20 Javascript
不使用script导入js文件的几种方法
2016/10/27 Javascript
使用Vue.js创建一个时间跟踪的单页应用
2016/11/28 Javascript
js实现百度搜索提示框
2017/02/05 Javascript
JavaScript基础之this详解
2017/06/04 Javascript
w3c编程挑战_初级脚本算法实战篇
2017/06/23 Javascript
详解cordova打包成webapp的方法
2017/10/18 Javascript
微信小程序获取手机系统信息的方法【附源码下载】
2017/12/07 Javascript
使用express+multer实现node中的图片上传功能
2018/02/02 Javascript
vue中element 上传功能的实现思路
2018/07/06 Javascript
vee-validate vue 2.0自定义表单验证的实例
2018/08/28 Javascript
[02:26]2016国际邀请赛8月3日开战 中国军团出征西雅图
2016/08/02 DOTA
[49:28]VP vs Optic 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python访问系统环境变量的方法
2015/04/29 Python
在pandas多重索引multiIndex中选定指定索引的行方法
2018/11/16 Python
Python字符串逆序输出的实例讲解
2019/02/16 Python
pycharm设置鼠标悬停查看方法设置
2019/07/29 Python
Python基础之高级变量类型实例详解
2020/01/03 Python
python 元组和列表的区别
2020/12/30 Python
Django框架实现在线考试系统的示例代码
2020/11/30 Python
Pandas之缺失数据的实现
2021/01/06 Python
营销经理工作检讨书
2014/11/03 职场文书
2015年驾驶员工作总结
2015/04/29 职场文书
中学生国庆节演讲稿2015
2015/07/30 职场文书
JavaScript原始值与包装对象的详细介绍
2021/05/11 Javascript
十大动画制作软件,Adobe产品上榜两款,第一是行业标准软件
2022/03/18 杂记