jQuery属性操作(二)
挂载到$上的几个属性操作方法分析,发现属性操作用到了sizzle封装的方法
attr: function( elem, name, value ) {
var hooks, ret,
nType = elem.nodeType;
// 如果elem不存在,或者是文本节点、注释或者是属性节点,直接返回。
if ( !elem || nType === 3 || nType === 8 || nType === 2 ) {
return;
}
// 当不支持getAtrribute方法时(估计是处理浏览器兼容问题)
if ( typeof elem.getAttribute === core_strundefined ) {
// 交给prop处理
return jQuery.prop( elem, name, value );
}
// All attributes are lowercase
// Grab necessary hook if one is defined
// 当elem类型不是元素时或者elem不是XML文档时
if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {
// 将属性名转换成小写字母
name = name.toLowerCase();
// 根据属性名得到对应的hooks,竟然依赖Sizzle,汗。。。
hooks = jQuery.attrHooks[ name ] ||
( jQuery.expr.match.bool.test( name ) ? boolHook : nodeHook );
}
// 如果有第三个参数(value)
if ( value !== undefined ) {
// 如果第三个参数是null
if ( value === null ) {
// 清空elem上属性为name的属性
jQuery.removeAttr( elem, name );
// 如果hooks存在,并且hooks存在set方法,执行hooks的set方法将结果赋值给ret,如果ret不是undefined,返回ret
} else if ( hooks && "set" in hooks && (ret = hooks.set( elem, value, name )) !== undefined ) {
return ret;
// 如果是支持setAttribute的浏览器,直接调用setAttribute方法,并将value转换成字符串
} else {
elem.setAttribute( name, value + "" );
return value;
}
// 如果没有value,并且hooks存在,并且hooks有get方法,调用get方法获取到元素上的name属性并返回属性值
} else if ( hooks && "get" in hooks && (ret = hooks.get( elem, name )) !== null ) {
return ret;
// 此处处理没有value,但不需要hooks处理的情况。
} else {
// jQuery.find == Sizzle。调用sizzle封装的方法获取元素属性值
ret = jQuery.find.attr( elem, name );
// 返回ret
return ret == null ?
undefined :
ret;
}
},
// 删除属性
removeAttr: function( elem, value ) {
var name, propName,
i = 0,
// value可以是一个空格间隔的字符串,通过正则处理,将value按空格分隔形成数组,赋值给attrNames。
attrNames = value && value.match( core_rnotwhite );
// 如果attrNames数组不为空,并且elem属于元素节点
if ( attrNames && elem.nodeType === 1 ) {
// 遍历attrNames数组
while ( (name = attrNames[i++]) ) {
// 如果该属性存在于propFix对象中,则将对象中对应的值赋值给propName,否则直接将name赋值给propName(propFix中做了一些替换)
propName = jQuery.propFix[ name ] || name;
// 如果是布尔属性(猜测可能是处理例如checked这样的属性的)
if ( jQuery.expr.match.bool.test( name ) ) {
// 将其值设置为false
elem[ propName ] = false;
}
// 调用elem的removeAttribute方法,删除那么属性
elem.removeAttribute( name );
}
}
},
jQuery属性操作(二)的更多相关文章
- jquery——属性操作、特殊效果
1. attr().prop() 取出或者设置某个属性的值 <!DOCTYPE html> <html lang="en"> <head> &l ...
- Jquery属性操作(入门二)
********JQuery属性相关的操作******** 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个 ...
- jQuery源代码学习之八——jQuery属性操作模块
一.jQuery属性模块整体介绍 jQuery的属性操作模块分四个部分:html属性操作,dom属性操作,类样式操作,和值操作. html属性操作(setAttribute/getAttribute) ...
- python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax
一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...
- web前端----jQuery属性操作
知识点总结 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个参数是设置属性值 - 点击加载图片示例 remo ...
- 前端之JQuery:JQuery属性操作
Jquery2--属性相关的操作 知识点总结 1.属性 属性(如果你的选择器选出了多个对象,那么默认只会返回出第一个属性). attr(属性名|属性值) - 一个参数是获取属性的值,两个参数是设置属性 ...
- jQuery属性操作
jQuery 的属性操作的核心部分其实就是对底层 getAttribute().setAttributes()等方法的一系列兼容性处理 ...if ( notxml ) { name = name.t ...
- jQuery 属性操作和CSS 操作
如有在jQuery方法中涉及到函数,此函数必定会返回一个数值(函数由于运行次数不同触发一些不同效果) jQuery 属性操作方法(以下方法前些日子学习过,不再赘述) addClass() attr() ...
- jQuery属性操作(四)
通过阅读jQuery为属性操作封装的基本方法和为处理兼容性问题提供的hooks,发现jQuery在属性操作方面并没有做过多的设计,只是处理一下兼容性问题,然后调用基础的DOM操作方法.以下是对JQue ...
随机推荐
- Xianfeng轻量级Java中间件平台:基于RBAC模型实现权限控制的原理
首先,白话一下RBAC模型.RBAC是基于角色的访问控制(Role-Based Access Control)的简称.RBAC认为权限授权实际上是Who.What.How的问题.在RBAC模型中,wh ...
- 消息中间件activemq-5.13.0整合spring
首先说明这里是在qctivemq配置好并启动服务的情况下进行,请先自行配置好.也可关注我的博文(消息中间件qctivemq安全验证配置)进行配置. 1.首先看一下项目结构 2.所需jar包,这里只列出 ...
- DWZ主从表界面唯一性验证(自写js)(二)
上篇介绍了自写js判断的前三项,本篇博客介绍第四步,关于触发课程代码文本框的离开事件后,判断一整列的课程代码之间是否有重复的值. 此问题可以提取为判断一个数组里是否有重复值,重复值是什么. 第四步→判 ...
- Unity用代码实现Remove Missing Script
[MenuItem("Edit/Cleanup Missing Scripts")] static void CleanupMissingScripts () { ; i < ...
- Python 多线程相关知识学习
多线程类似于同时执行多个不同程序,多线程运行有如下优点: 使用线程可以把占据长时间的程序中的任务放到后台去处理. 用户界面可以更加吸引人,这样比如用户点击了一个按钮去触发某些事件的处理,可以弹出一个进 ...
- arcview、arcinfo、arceditor的区别
arcview = 交互式制图+地图设计和输出+基于地图的查询+直接读取数据+地理处理框架+定制应用程序框架 arceditor = arcview + geodatabase定义.管理和编辑 arc ...
- python使用paramiko自动化部署linux程序
使用paramiko模块,比os模块和command模块更加的兼容各种环境.后面两个只能在服务器本机 执行,此模块写得python文件无论是在本地还是服务器本身上运行,都能兼容. paramiko模块 ...
- MTK 强制横屏
frameworks\base\policy\src\com\android\internal\policy\impl目录下的PhoneWindowManager.java的rotationForOr ...
- Linux Device Tree
原创博文,转载请标明出处--周学伟 http://www.cnblogs.com/zxouxuewei/ 设备树使用手册 基本数据格式 设备树是一个包含节点和属性的简单树状结构.属性就是键-值对,而 ...
- Get started with ros -- 1
原创博文:转载请标明出处(周学伟):http://www.cnblogs.com/zxouxuewei/tag/ 一.Introduction: 机器人操作系统(ROS)是使机器人系统的不同部分能够发 ...