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 相关文章推荐
扩展javascript的Date方法实现代码(prototype)
Nov 20 Javascript
JavaScript获取图片的原始尺寸以宽度为例
May 04 Javascript
纯javascript模仿微信打飞机小游戏
Aug 20 Javascript
MVC Ajax Helper或Jquery异步加载部分视图
Nov 29 Javascript
javascript图片预加载完整实例
Dec 10 Javascript
详解javascript跨浏览器事件处理程序
Mar 27 Javascript
jquery分页插件jquery.pagination.js实现无刷新分页
Apr 01 Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 Javascript
Node.JS中事件轮询(Event Loop)的解析
Feb 25 Javascript
React Native实现进度条弹框的示例代码
Jul 17 Javascript
学习RxJS之JavaScript框架Cycle.js
Jun 17 Javascript
JavaScript实现多球运动效果
Sep 07 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与C#分别格式化文件大小的代码
2011/05/14 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
php配合jquery实现增删操作具体实例
2013/12/12 PHP
PHP文件锁函数flock()详细介绍
2014/11/18 PHP
CI操作cookie的方法分析(基于helper类库)
2016/03/28 PHP
PHP+MySQL实现模糊查询员工信息功能示例
2018/06/01 PHP
PHP实现的62进制转10进制,10进制转62进制函数示例
2019/06/06 PHP
ext 列表页面关于多行查询的办法
2010/03/25 Javascript
struts2+jquery组合验证注册用户是否存在
2014/04/30 Javascript
采用call方式实现js继承
2014/05/20 Javascript
js使用正则实现ReplaceAll全部替换的方法
2014/08/22 Javascript
node.js中的fs.mkdirSync方法使用说明
2014/12/17 Javascript
JS弹出可拖拽可关闭的div层完整实例
2015/02/13 Javascript
JavaScript之浏览器对象_动力节点Java学院整理
2017/07/03 Javascript
在Vue中如何使用Cookie操作实例
2017/07/27 Javascript
js中时间格式化的几种方法
2018/07/22 Javascript
加快Vue项目的开发速度的方法
2018/12/12 Javascript
layui的数据表格+springmvc实现搜索功能的例子
2019/09/28 Javascript
python网络编程学习笔记(七):HTML和XHTML解析(HTMLParser、BeautifulSoup)
2014/06/09 Python
利用Python的Django框架生成PDF文件的教程
2015/07/22 Python
Python爬取APP下载链接的实现方法
2016/09/30 Python
python装饰器实例大详解
2017/10/25 Python
python使用PyCharm进行远程开发和调试
2017/11/02 Python
Python 普通最小二乘法(OLS)进行多项式拟合的方法
2018/12/29 Python
NumPy中的维度Axis详解
2019/11/26 Python
python用什么编辑器进行项目开发
2020/06/17 Python
python开发一款翻译工具
2020/10/10 Python
CSS3之2D与3D变换的实现方法
2019/01/28 HTML / CSS
如何查询Oracle数据库中已经创建的索引
2013/10/11 面试题
幼儿教师思想汇报
2014/01/10 职场文书
4s店销售经理岗位职责
2014/07/19 职场文书
全民创业工作总结
2015/08/13 职场文书
用Python提取PDF表格的方法
2021/04/11 Python
详解Redis实现限流的三种方式
2021/04/27 Redis
springboot @ConfigurationProperties和@PropertySource的区别
2021/06/11 Java/Android
Java结构型设计模式之组合模式详解
2022/09/23 Java/Android