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动态绑定事件的简单实现代码
Dec 25 Javascript
Javascript排序算法之计数排序的实例
Apr 05 Javascript
IE浏览器中图片onload事件无效的解决方法
Apr 29 Javascript
使用jquery操作session方法分享
Jan 22 Javascript
三分钟带你玩转jQuery.noConflict()
Feb 15 Javascript
JS代码实现table数据分页效果
May 26 Javascript
JQuery 设置checkbox值二次无效的解决方法
Jul 22 Javascript
requirejs + vue 项目搭建详解
Jun 16 Javascript
二维码图片生成器QRCode.js简单介绍
Aug 18 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
Mar 19 Javascript
Vue-CLI项目中路由传参的方式详解
Sep 01 Javascript
Vue.js如何使用Socket.IO的示例代码
Sep 05 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实现的Captcha验证码类实例
2014/09/22 PHP
PHP贪婪算法解决0-1背包问题实例分析
2015/03/23 PHP
php curl 获取https请求的2种方法
2015/04/27 PHP
PHP url的pathinfo模式加载不同控制器的简单实现
2016/08/12 PHP
PHP使用XMLWriter读写xml文件操作详解
2018/07/31 PHP
用javascript实现分割提取页面所需内容
2007/05/09 Javascript
Javascript 同时提交多个Web表单的方法
2009/02/19 Javascript
jQuery UI Autocomplete 体验分享
2012/02/14 Javascript
js浮点数精确计算(加、减、乘、除)
2013/12/26 Javascript
jquery动态改变form属性提交表单
2014/06/03 Javascript
基于JQuery实现分隔条的功能
2016/06/17 Javascript
javascript对浅拷贝和深拷贝的详解
2016/10/14 Javascript
一份超级详细的Vue-cli3.0使用教程【推荐】
2018/11/15 Javascript
Electron实现应用打包、自动升级过程解析
2020/07/07 Javascript
[51:17]VGJ.T vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
[47:10]完美世界DOTA2联赛PWL S3 LBZS vs Rebirth 第二场 12.16
2020/12/18 DOTA
python操作sqlite的CRUD实例分析
2015/05/08 Python
PHP网页抓取之抓取百度贴吧邮箱数据代码分享
2016/04/13 Python
点球小游戏python脚本
2018/05/22 Python
python 获取字符串MD5值方法
2018/05/29 Python
Python开发虚拟环境使用virtualenvwrapper的搭建步骤教程图解
2018/09/19 Python
python利用小波分析进行特征提取的实例
2019/01/09 Python
python调用动态链接库的基本过程详解
2019/06/19 Python
python下的opencv画矩形和文字注释的实现方法
2019/07/09 Python
python__name__原理及用法详解
2019/11/02 Python
Django之腾讯云短信的实现
2020/06/12 Python
pytorch 常用函数 max ,eq说明
2020/06/28 Python
Tory Burch英国官方网站:美国时尚生活品牌
2017/12/06 全球购物
日本最大级玩偶手办购物:あみあみ Amiami
2018/04/23 全球购物
给同学的道歉信
2014/01/16 职场文书
共筑中国梦演讲稿
2014/04/23 职场文书
工程项目经理任命书
2014/06/05 职场文书
教师查摆问题自查报告
2014/10/11 职场文书
论群众路线学习心得体会
2014/10/31 职场文书
行政主管岗位职责范本
2015/04/09 职场文书
Java tomcat手动配置servlet详解
2021/11/27 Java/Android