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使用ColorBox弹出图片组浏览层实例演示
Mar 14 Javascript
JS中的substring和substr函数的区别说明
May 07 Javascript
javascript检查表单数据是否改变的方法
Jul 30 Javascript
javascript操作字符串的原生方法
Dec 22 Javascript
jQuery实现点击图片翻页展示效果的方法
Feb 16 Javascript
jQuery的事件委托实例分析
Jul 15 Javascript
vue自定义全局组件(自定义插件)的用法
Jan 30 Javascript
详解js中let与var声明变量的区别
Apr 05 Javascript
vue动态子组件的两种实现方式
Sep 01 Javascript
Vue 实现监听窗口关闭事件,并在窗口关闭前发送请求
Sep 01 Javascript
Vue3不支持Filters过滤器的问题
Sep 24 Javascript
JavaScript canvas实现流星特效
May 20 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
Discuz论坛密码与密保加密规则
2016/12/19 PHP
php json转换相关知识(小结)
2018/12/21 PHP
fckeditor 获取文本框值的实现代码
2009/02/09 Javascript
js弹出层(jQuery插件形式附带reLoad功能)
2013/04/12 Javascript
Dom 学习总结以及实例的使用介绍
2013/04/24 Javascript
使用js判断TextBox控件值改变然后出发事件
2014/03/07 Javascript
JavaScript中计算网页中某个元素的位置
2015/06/10 Javascript
js检测用户输入密码强度
2015/10/22 Javascript
分步解析JavaScript实现tab选项卡自动切换功能
2016/01/25 Javascript
jQuery简单设置文本框回车事件的方法
2016/08/01 Javascript
详解JavaScript时间处理之几个月前或几个月后的指定日期
2016/12/21 Javascript
php简单数据库操作类的封装
2017/06/08 Javascript
jQuery实现节点的追加、替换、删除、复制功能示例
2017/07/11 jQuery
vue+springmvc导出excel数据的实现代码
2018/06/27 Javascript
深入理解与使用keep-alive(配合router-view缓存整个路由页面)
2018/09/25 Javascript
VUE实现密码验证与提示功能
2019/10/18 Javascript
JS使用setInterval计时器实现挑战10秒
2020/11/08 Javascript
VUE项目实现主题切换的多种方法
2020/11/26 Vue.js
vue.js watch经常失效的场景与解决方案
2021/01/07 Vue.js
wxpython学习笔记(推荐查看)
2014/06/09 Python
Python与Redis的连接教程
2015/04/22 Python
Python实现二维数组输出为图片
2018/04/03 Python
Python、 Pycharm、Django安装详细教程(图文)
2019/04/12 Python
python如何实现异步调用函数执行
2019/07/08 Python
python 设置xlabel,ylabel 坐标轴字体大小,字体类型
2019/07/23 Python
Django 在iframe里跳转顶层url的例子
2019/08/21 Python
python协程gevent案例 爬取斗鱼图片过程解析
2019/08/27 Python
自定义实现 PyQt5 下拉复选框 ComboCheckBox的完整代码
2020/03/30 Python
使用Python将Exception异常错误堆栈信息写入日志文件
2020/04/08 Python
解决Pytorch自定义层出现多Variable共享内存错误问题
2020/06/28 Python
html5 viewport使用方法示例详解
2013/12/02 HTML / CSS
canvas实现漂亮的下雨效果的示例
2018/04/18 HTML / CSS
知识竞赛活动方案
2014/02/18 职场文书
小学体育队列队形教学反思
2016/02/16 职场文书
Python字符串常规操作小结
2022/04/03 Python
Vue Element plus使用方法梳理
2022/12/24 Vue.js