JQuery节点元素属性操作方法


Posted in Javascript onJune 11, 2015

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

在JQuery中,用attr()方法来获取和设置元素属性,removeAttr()方法来删除元素属性。

获取属性和设置属性

如果要获取p元素的属性title,那么只需要给attr()方法传递一个参数,即属性名称。

var $para = $("p"); //获取<p>节点  
var p_txt = $para.attr("title"); //获取<p>元素节点属性title

如果要设置<p>元素的属性title的值,也可以使用同一个方法,不同的是,需要传递两个参数即属性名称和对应的值。

$("p").attr("title", "your title");
//设置单个的属性值

如果需要一次性为同一个元素设置多个属性,可以使用下面的代码来实现:

$("p") .attr({"title" : "your title", "name": "test"});   
//将一个“名/值”形式的对象设置为匹配元素的属性

JQuery中的很多方法都是同一个函数实现获取(getter)和设置(setter)的,例如上面的attr()方法,既能设置元素属性的值,也能获取元素属性的值。类似的还有html()、text()、height()、width()、val()和css()等方法。

删除属性

在某些情况下,需要删除文档中某个元素的特定属性,可以使用removeAttr()方法来完成该任务。

如果需要删除p元素的title属性,可以使用下面的代码实现:

$("p").removeAttr("title");
//删除<p>元素的属性title

在Firebug下可以看得非常清楚。

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

Javascript 相关文章推荐
JavaScript中的Array对象使用说明
Jan 17 Javascript
从零开始学习jQuery (十) jQueryUI常用功能实战
Feb 23 Javascript
js中的事件捕捉模型与冒泡模型实例分析
Jan 10 Javascript
JQuery实现Ajax加载图片的方法
Dec 24 Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 Javascript
Vue2.0子同级组件之间数据交互方法
Feb 28 Javascript
axios发送post请求springMVC接收不到参数的解决方法
Mar 05 Javascript
微信小程序实现通过js操作wxml的wxss属性示例
Dec 06 Javascript
通过说明与示例了解js五种设计模式
Jun 17 Javascript
js实现拖动缓动效果
Jan 13 Javascript
JS原型prototype和__proto__用法实例分析
Mar 14 Javascript
js通过canvas生成图片缩略图
Oct 02 Javascript
JQuery包裹DOM节点的方法
Jun 11 #Javascript
JQuery替换DOM节点的方法
Jun 11 #Javascript
JavaScript中实现map功能代码分享
Jun 11 #Javascript
JQuery复制DOM节点的方法
Jun 11 #Javascript
JavaScript中标识符提升问题
Jun 11 #Javascript
JQuery删除DOM节点的方法
Jun 11 #Javascript
JQuery插入DOM节点的方法
Jun 11 #Javascript
You might like
php中一个完整表单处理实现代码
2011/11/10 PHP
java与javascript之间json格式数据互转介绍
2013/10/29 Javascript
按下Enter焦点移至下一个控件的实现js代码
2013/12/11 Javascript
详解Javascript事件驱动编程
2016/01/03 Javascript
jQuery版本升级踩坑大全
2016/01/12 Javascript
JS原型链怎么理解
2016/06/27 Javascript
总结几道关于Node.js的面试问题
2017/01/11 Javascript
JavaScript 网页中实现一个计算当年还剩多少时间的倒数计时程序
2017/01/25 Javascript
使用AngularJS编写多选按钮选中时触发指定方法的指令代码详解
2017/07/24 Javascript
在Mac下彻底卸载node和npm的方法
2018/05/16 Javascript
Vue中&quot;This dependency was not found&quot;问题的解决方法
2018/06/19 Javascript
微信小程序实现抖音播放效果的实例代码
2020/04/11 Javascript
基于leaflet.js实现修改地图主题样式的流程分析
2020/05/15 Javascript
[01:23]2014DOTA2国际邀请赛 球迷无处不在Ti现场世界杯受关注
2014/07/10 DOTA
python创建一个最简单http webserver服务器的方法
2015/05/08 Python
详解Django中间件的5种自定义方法
2018/07/26 Python
python消除序列的重复值并保持顺序不变的实例
2018/11/08 Python
python requests 库请求带有文件参数的接口实例
2019/01/03 Python
python 返回一个列表中第二大的数方法
2019/07/09 Python
Django中自定义模型管理器(Manager)及方法
2019/09/23 Python
Python3 io文本及原始流I/O工具用法详解
2020/03/23 Python
Python Switch Case三种实现方法代码实例
2020/06/18 Python
html5 canvas 简单画板实现代码
2012/01/05 HTML / CSS
美国女孩服装购物网站:Justice
2017/03/04 全球购物
用JAVA实现一种排序,JAVA类实现序列化的方法(二种)
2014/04/23 面试题
求职简历自荐信范文
2013/10/21 职场文书
财务副总经理工作职责
2013/11/25 职场文书
行政人员工作职责
2013/12/05 职场文书
策划总监岗位职责
2014/02/16 职场文书
最经典的商业地产项目广告词
2014/03/13 职场文书
党校个人自我鉴定范文
2014/03/28 职场文书
幼儿园评语大全
2014/04/17 职场文书
道德大讲堂实施方案
2014/05/14 职场文书
2016年“12.4”法制宣传日活动总结
2016/04/01 职场文书
小程序后台PHP版本部署运行 LNMP+WNMP
2021/04/01 Servers
MySQL查询学习之基础查询操作
2021/05/08 MySQL