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实现带关闭按钮的网页漂浮广告代码
Jan 12 Javascript
通过复制Table生成word和excel的javascript代码
Jan 20 Javascript
使用javascript为网页增加夜间模式
Jan 26 Javascript
js实现匹配时换色的输入提示特效代码
Aug 17 Javascript
js中flexible.js实现淘宝弹性布局方案
Jun 23 Javascript
jQuery实现元素拖拽并cookie保存顺序的方法
Feb 20 Javascript
Vuejs第十二篇之动态组件全面解析
Sep 09 Javascript
BootStrap入门教程(三)之响应式原理
Sep 19 Javascript
使用JavaScript实现一个小程序之99乘法表
Sep 21 Javascript
用WebStorm进行Angularjs 2开发(环境篇:Windows 10,Angular-cli方式)
Dec 05 Javascript
TypeScript的安装、使用、自动编译的实现
Apr 10 Javascript
Webpack3+React16代码分割的实现
Mar 03 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查看session内容的函数
2008/08/27 PHP
php empty() 检查一个变量是否为空
2011/11/10 PHP
php检测网页是否被百度收录的函数代码
2013/10/09 PHP
2个比较经典的PHP加密解密函数分享
2014/07/01 PHP
PHP中file_get_contents高?用法实例
2014/09/24 PHP
PHP实现对文件锁进行加锁、解锁操作的方法
2017/07/04 PHP
PHP多进程之pcntl_fork的实例详解
2017/10/15 PHP
javascript innerText和innerHtml应用
2010/01/28 Javascript
jQuery源码分析-03构造jQuery对象-工具函数
2011/11/14 Javascript
一个JavaScript防止表单重复提交的实例
2014/10/21 Javascript
Javascript中call和apply函数的比较和使用实例
2015/02/03 Javascript
javascript实现确定和取消提示框效果
2015/07/10 Javascript
jQuery UI库中dialog对话框功能使用全解析
2016/04/23 Javascript
全面解析DOM操作和jQuery实现选项移动操作代码分享
2016/06/07 Javascript
基于Bootstrap的后台管理面板 Bootstrap Metro Dashboard
2016/06/17 Javascript
Vue 过渡(动画)transition组件案例详解
2017/01/22 Javascript
Vue组件库发布到npm详解
2018/02/17 Javascript
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
2019/05/12 jQuery
three.js 将图片马赛克化的示例代码
2020/07/31 Javascript
[06:13]DOTA2进化论(修改版)
2013/10/08 DOTA
Python标准库urllib2的一些使用细节总结
2015/03/16 Python
Python的__builtin__模块中的一些要点知识
2015/05/02 Python
详解Python编程中基本的数学计算使用
2016/02/04 Python
python利用正则表达式排除集合中字符的功能示例
2017/10/10 Python
tensorflow输出权重值和偏差的方法
2018/02/10 Python
python批量查询、汉字去重处理CSV文件
2018/05/31 Python
浅谈Pandas:Series和DataFrame间的算术元素
2018/12/22 Python
对Python多线程读写文件加锁的实例详解
2019/01/14 Python
Linux上使用Python统计每天的键盘输入次数
2019/04/17 Python
中国排名第一的外贸销售网站:LightInTheBox.com(兰亭集势)
2016/10/28 全球购物
英国Radley包德国官网:Radley London德国
2019/11/18 全球购物
《浅水洼里的小鱼》听课反思
2014/02/28 职场文书
银行委托书范本
2014/09/28 职场文书
2015年成本会计工作总结
2015/10/14 职场文书
关于感恩的作文
2019/08/26 职场文书
Python源码解析之List
2021/05/21 Python