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 EXCEL 操作类代码
Jul 30 Javascript
js 多种变量定义(对象直接量,数组直接量和函数直接量)
May 24 Javascript
Jquery常用技巧收集整理篇
Nov 14 Javascript
js下将阿拉伯数字每三位一逗号分隔(如:15000000转化为15,000,000)
Jun 02 Javascript
jquery实现未经美化的简洁TAB菜单效果
Aug 28 Javascript
理解Javascript图片预加载
Feb 23 Javascript
JavaScript中EventLoop介绍
Jan 22 Javascript
vue中设置height:100%无效的问题及解决方法
Jul 27 Javascript
vue项目引入字体.ttf的方法
Sep 28 Javascript
JS canvas绘制五子棋的棋盘
May 28 Javascript
vue添加class样式实例讲解
Feb 12 Javascript
React优化子组件render的使用
May 12 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
博士208HAF收音机实习报告
2021/03/02 无线电
ThinkPHP Mobile使用方法简明教程
2014/06/18 PHP
PHP GD库相关图像生成和处理函数小结
2016/09/30 PHP
浅谈PHP中new self()和new static()的区别
2017/08/11 PHP
Javascript操纵Cookie实现购物车程序
2007/02/15 Javascript
2010年最佳jQuery插件整理
2010/12/06 Javascript
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
2020/04/04 Javascript
javascript unicode与GBK2312(中文)编码转换方法
2013/11/14 Javascript
纯js写的分页表格数据为json串
2014/02/18 Javascript
jQuery实现根据类型自动显示和隐藏表单
2015/03/18 Javascript
浅谈react-native热更新react-native-pushy集成遇到的问题
2017/09/30 Javascript
ztree实现左边动态生成树右边为内容详情功能
2017/11/03 Javascript
vue-router 源码之实现一个简单的 vue-router
2018/07/02 Javascript
React Native基础入门之调试React Native应用的一小步
2018/07/02 Javascript
详解在vue-cli中使用graphql即vue-apollo的用法
2018/09/08 Javascript
Vue 组件参数校验与非props特性的方法
2019/02/12 Javascript
JavaScript对象原型链原理详解
2020/02/05 Javascript
vue使用自定义事件的表单输入组件用法详解【日期组件与货币组件】
2020/06/01 Javascript
[57:29]Alliance vs KG 2019国际邀请赛小组赛 BO2 第二场 8.16
2019/08/17 DOTA
使用python将mdb数据库文件导入postgresql数据库示例
2014/02/17 Python
详解Python网络爬虫功能的基本写法
2016/01/28 Python
Python 备份程序代码实现
2017/03/06 Python
教你用 Python 实现微信跳一跳(Mac+iOS版)
2018/01/04 Python
详解python函数传参是传值还是传引用
2018/01/16 Python
Python实现简单生成验证码功能【基于random模块】
2018/02/10 Python
python中@property和property函数常见使用方法示例
2019/10/21 Python
Python 随机生成测试数据的模块:faker基本使用方法详解
2020/04/09 Python
公司中秋节活动方案
2014/02/12 职场文书
预备党员承诺书
2014/03/25 职场文书
党员干部一句话承诺
2014/05/30 职场文书
跳蚤市场口号
2014/06/13 职场文书
村级四风对照检查材料
2014/08/24 职场文书
2014年校长工作总结
2014/12/11 职场文书
2015年事业单位工作总结
2015/04/27 职场文书
python 开心网和豆瓣日记爬取的小爬虫
2021/05/29 Python
nginx从安装到配置详细说明(安装,安全配置,防盗链,动静分离,配置 HTTPS,性能优化)
2022/02/12 Servers