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 删除字符串空格多种方法小结
Oct 24 Javascript
可在线编辑网页文字效果代码(单击)
Mar 02 Javascript
验证码按回车不变解决方法
Mar 29 Javascript
jquery foreach使用示例
Sep 12 Javascript
jQuery Easyui快速入门教程
Aug 21 Javascript
jQuery实现的自定义弹出层效果实例详解
Sep 04 Javascript
JavaScript-html标题滚动效果的简单实现
Sep 08 Javascript
javascript实现秒表计时器的制作方法
Feb 16 Javascript
js实现数组和对象的深浅拷贝
Sep 30 Javascript
微信小程序的部署方法步骤
Sep 04 Javascript
在博客园博文中添加自定义右键菜单的方法详解
Feb 05 Javascript
解决Vue+SpringBoot+Shiro跨域问题
Jun 09 Vue.js
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
用PHP4访问Oracle815
2006/10/09 PHP
php curl获取网页内容(IPV6下超时)的解决办法
2013/07/16 PHP
php 如何获取数组第一个值
2013/08/06 PHP
PHP生成不同颜色、不同大小的tag标签函数
2013/09/23 PHP
php将图片保存入mysql数据库失败的解决方法
2014/12/27 PHP
php实现微信公众平台账号自定义菜单类
2015/10/11 PHP
PHP使用trim函数去除字符串左右空格及特殊字符实例
2016/01/07 PHP
PC端微信扫码支付成功之后自动跳转php版代码
2017/07/07 PHP
火狐4、谷歌12不支持Jquery Validator的解决方法分享
2011/06/20 Javascript
JS按位非(~)运算符与~~运算符的理解分析
2011/07/31 Javascript
jquery创建并行对象或者合并对象的实现代码
2012/10/10 Javascript
jQuery+ajax实现动态执行脚本的方法
2015/01/27 Javascript
js选项卡的实现方法
2015/02/09 Javascript
jQuery支持动态参数将函数绑定到事件上的方法
2015/03/17 Javascript
JavaScript面向对象的实现方法小结
2015/04/14 Javascript
jQuery中animate动画第二次点击事件没反应
2015/05/07 Javascript
关于js里的this关键字的理解
2015/08/17 Javascript
jQuery满屏焦点图左右滚动特效代码分享
2015/09/07 Javascript
JavaScript处理解析JSON数据过程详解
2015/09/11 Javascript
js格式化输入框内金额、银行卡号
2016/02/01 Javascript
分享jQuery封装好的一些常用操作
2016/07/28 Javascript
jQuery实现选中行变色效果(实例讲解)
2017/07/06 jQuery
js链表操作(实例讲解)
2017/08/29 Javascript
Node.js中读取TXT文件内容fs.readFile()用法
2018/10/10 Javascript
更强大的vue ssr实现预取数据的方式
2019/07/19 Javascript
webstorm建立vue-cli脚手架的傻瓜式教程
2020/09/22 Javascript
ES6学习教程之Promise用法详解
2020/11/22 Javascript
Python文本相似性计算之编辑距离详解
2016/11/28 Python
python虚拟环境的安装配置图文教程
2017/10/20 Python
一文带你了解Python中的字符串是什么
2018/11/20 Python
python使用KNN算法识别手写数字
2019/04/25 Python
python+mysql实现个人论文管理系统
2019/10/25 Python
简单了解python shutil模块原理及使用方法
2020/04/28 Python
医药销售自我评价200字
2014/09/11 职场文书
机械设计专业大学生职业生涯规划书范文
2014/09/13 职场文书
工作所在部门证明
2014/09/21 职场文书