深入学习jquery源码之attr()与removeAttr()

attr(name|properties|key,value|fn)

概述

设置或返回被选元素的属性值。

参数

name String

属性名称

properties Map

作为属性的“名/值对”对象

key,value String,Object

属性名称，属性值

key,function(index, attr) String,Function

1:属性名称。

2:返回属性值的函数,第一个参数为当前元素的索引值，第二个参数为原先的属性值。

返回文档中所有图像的src属性值。

$("img").attr("src");

为所有图像设置src和alt属性。

$("img").attr({ src: "test.jpg", alt: "Test Image" });

为所有图像设置src属性。

$("img").attr("src","test.jpg");

把src属性的值设置为title属性的值。

$("img").attr("title", function() { return this.src });

removeAttr(name)

概述

从每一个匹配的元素中删除一个属性

1.6以下版本在IE6使用JQuery的removeAttr方法删除disabled是无效的。解决的方法就是使用$("XX").prop("disabled",false);
1.7版本在IE6下已支持删除disabled。

参数

name String

要删除的属性名

将文档中图像的src属性删除

<img src="test.jpg"/>

$("img").removeAttr("src");

[ <img /> ]

jquery源码

        // Multifunctional method to get and set values of a collection// The value/s can optionally be executed if it's a functionvar access = jQuery.access = function (elems, fn, key, value, chainable, emptyGet, raw) {var i = 0,length = elems.length,bulk = key == null;// Sets many valuesif (jQuery.type(key) === "object") {chainable = true;for (i in key) {jQuery.access(elems, fn, i, key[i], true, emptyGet, raw);}// Sets one value} else if (value !== undefined) {chainable = true;if (!jQuery.isFunction(value)) {raw = true;}if (bulk) {// Bulk operations run against the entire setif (raw) {fn.call(elems, value);fn = null;// ...except when executing function values} else {bulk = fn;fn = function (elem, key, value) {return bulk.call(jQuery(elem), value);};}}if (fn) {for (; i < length; i++) {fn(elems[i], key, raw ? value : value.call(elems[i], i, fn(elems[i], key)));}}}return chainable ?elems :// Getsbulk ?fn.call(elems) :length ? fn(elems[0], key) : emptyGet;};var nodeHook, boolHook,attrHandle = jQuery.expr.attrHandle,ruseDefault = /^(?:checked|selected)$/i,getSetAttribute = support.getSetAttribute,getSetInput = support.input;jQuery.fn.extend({attr: function (name, value) {return access(this, jQuery.attr, name, value, arguments.length > 1);},removeAttr: function (name) {return this.each(function () {jQuery.removeAttr(this, name);});}});jQuery.extend({attr: function (elem, name, value) {var hooks, ret,nType = elem.nodeType;// don't get/set attributes on text, comment and attribute nodesif (!elem || nType === 3 || nType === 8 || nType === 2) {return;}// Fallback to prop when attributes are not supportedif (typeof elem.getAttribute === strundefined) {return jQuery.prop(elem, name, value);}// All attributes are lowercase// Grab necessary hook if one is definedif (nType !== 1 || !jQuery.isXMLDoc(elem)) {name = name.toLowerCase();hooks = jQuery.attrHooks[name] ||(jQuery.expr.match.bool.test(name) ? boolHook : nodeHook);}if (value !== undefined) {if (value === null) {jQuery.removeAttr(elem, name);} else if (hooks && "set" in hooks && (ret = hooks.set(elem, value, name)) !== undefined) {return ret;} else {elem.setAttribute(name, value + "");return value;}} else if (hooks && "get" in hooks && (ret = hooks.get(elem, name)) !== null) {return ret;} else {ret = jQuery.find.attr(elem, name);// Non-existent attributes return null, we normalize to undefinedreturn ret == null ?undefined :ret;}},removeAttr: function (elem, value) {var name, propName,i = 0,attrNames = value && value.match(rnotwhite);if (attrNames && elem.nodeType === 1) {while ((name = attrNames[i++])) {propName = jQuery.propFix[name] || name;// Boolean attributes get special treatment (#10870)if (jQuery.expr.match.bool.test(name)) {// Set corresponding property to falseif (getSetInput && getSetAttribute || !ruseDefault.test(name)) {elem[propName] = false;// Support: IE<9// Also clear defaultChecked/defaultSelected (if appropriate)} else {elem[jQuery.camelCase("default-" + name)] =elem[propName] = false;}// See #9699 for explanation of this approach (setting first, then removal)} else {jQuery.attr(elem, name, "");}elem.removeAttribute(getSetAttribute ? name : propName);}}},attrHooks: {type: {set: function (elem, value) {if (!support.radioValue && value === "radio" && jQuery.nodeName(elem, "input")) {// Setting the type on a radio button after the value resets the value in IE6-9// Reset value to default in case type is set after value during creationvar val = elem.value;elem.setAttribute("type", value);if (val) {elem.value = val;}return value;}}}}});// Hook for boolean attributesboolHook = {set: function (elem, value, name) {if (value === false) {// Remove boolean attributes when set to falsejQuery.removeAttr(elem, name);} else if (getSetInput && getSetAttribute || !ruseDefault.test(name)) {// IE<8 needs the *property* nameelem.setAttribute(!getSetAttribute && jQuery.propFix[name] || name, name);// Use defaultChecked and defaultSelected for oldIE} else {elem[jQuery.camelCase("default-" + name)] = elem[name] = true;}return name;}};// Retrieve booleans speciallyjQuery.each(jQuery.expr.match.bool.source.match(/\w+/g), function (i, name) {var getter = attrHandle[name] || jQuery.find.attr;attrHandle[name] = getSetInput && getSetAttribute || !ruseDefault.test(name) ?function (elem, name, isXML) {var ret, handle;if (!isXML) {// Avoid an infinite loop by temporarily removing this function from the getterhandle = attrHandle[name];attrHandle[name] = ret;ret = getter(elem, name, isXML) != null ?name.toLowerCase() :null;attrHandle[name] = handle;}return ret;} :function (elem, name, isXML) {if (!isXML) {return elem[jQuery.camelCase("default-" + name)] ?name.toLowerCase() :null;}};});// fix oldIE attropertiesif (!getSetInput || !getSetAttribute) {jQuery.attrHooks.value = {set: function (elem, value, name) {if (jQuery.nodeName(elem, "input")) {// Does not return so that setAttribute is also usedelem.defaultValue = value;} else {// Use nodeHook if defined (#1954); otherwise setAttribute is finereturn nodeHook && nodeHook.set(elem, value, name);}}};}// IE6/7 do not support getting/setting some attributes with get/setAttributeif (!getSetAttribute) {// Use this for any attribute in IE6/7// This fixes almost every IE6/7 issuenodeHook = {set: function (elem, value, name) {// Set the existing or create a new attribute nodevar ret = elem.getAttributeNode(name);if (!ret) {elem.setAttributeNode((ret = elem.ownerDocument.createAttribute(name)));}ret.value = value += "";// Break association with cloned elements by also using setAttribute (#9646)if (name === "value" || value === elem.getAttribute(name)) {return value;}}};// Some attributes are constructed with empty-string values when not definedattrHandle.id = attrHandle.name = attrHandle.coords =function (elem, name, isXML) {var ret;if (!isXML) {return (ret = elem.getAttributeNode(name)) && ret.value !== "" ?ret.value :null;}};// Fixing value retrieval on a button requires this modulejQuery.valHooks.button = {get: function (elem, name) {var ret = elem.getAttributeNode(name);if (ret && ret.specified) {return ret.value;}},set: nodeHook.set};// Set contenteditable to false on removals(#10429)// Setting to empty string throws an error as an invalid valuejQuery.attrHooks.contenteditable = {set: function (elem, value, name) {nodeHook.set(elem, value === "" ? false : value, name);}};// Set width and height to auto instead of 0 on empty string( Bug #8150 )// This is for removalsjQuery.each(["width", "height"], function (i, name) {jQuery.attrHooks[name] = {set: function (elem, value) {if (value === "") {elem.setAttribute(name, "auto");return value;}}};});}if (!support.style) {jQuery.attrHooks.style = {get: function (elem) {// Return undefined in the case of empty string// Note: IE uppercases css property names, but if we were to .toLowerCase()// .cssText, that would destroy case senstitivity in URL's, like in "background"return elem.style.cssText || undefined;},set: function (elem, value) {return (elem.style.cssText = value + "");}};}

深入学习jquery源码之attr()与removeAttr()相关推荐

深入学习jquery源码之高德地图组件的使用
深入学习jquery源码之高德地图组件的使用高德地图组件是一类高度模块化的LBS服务组件,开发者通过调用相应标签便可轻松实现诸如在地图上标注点.查找附近poi.公交/驾车线路规划等功能.该类组件仅针 ...
深入学习jquery源码之addClass()和toggleClass()与hasClass()
深入学习jquery源码之addClass()和toggleClass()与hasClass() addClass(class|fn) 概述为每个匹配的元素添加指定的类名. 参数 class Str ...
深入学习jquery源码之jQuery的选择器引擎Sizzle(一)
深入学习jquery源码之jQuery的选择器引擎Sizzle Sizzle是一个纯javascript CSS选择器引擎.jquery1.3开始使用sizzle,Sizzle一反传统采取了相反的Ri ...
深入学习jquery源码之queue()与dequeue()
深入学习jquery源码之queue()与dequeue() queue(element,[queueName]) 概述显示或操作在匹配元素上执行的函数队列参数 element,[queueNam ...
深入学习jquery源码之ajaxSetup()
深入学习jquery源码之ajaxSetup() ajaxComplete(callback) 概述: AJAX 请求完成时执行函数.Ajax 事件. XMLHttpRequest 对象和设置作为参数 ...
学习 jQuery 源码整体架构，打造属于自己的 js 类库
虽然现在基本不怎么使用 jQuery了,但 jQuery流行 10多年的 JS库,还是有必要学习它的源码的.也可以学着打造属于自己的 js类库,求职面试时可以增色不少. 本文章学习的是 v3.4.1版 ...
妙味课堂：一起学习jQuery源码【逐行分析jQuery源码的奥秘】（妙味课堂笔记）-- 框架接口（1-3）
jQuery 的学习版本为: 2.0.3 匿名函数匿名函数自执行,目的是防止变量污染 (function(window,undefined){})(window); 内层代码块分析 (functio ...
jQuery源码浅谈系列---$.removeAttr()
removeAttr(name) ------- 从每一个匹配的元素中删除一个属性. 参数: name -----------------要删除的属性名 $('#ID').removeAttr(' ...
jQuery源码逐行分析学习01(jQuery的框架结构简化)
最近在学习jQuery源码,在此,特别做一个分享,把所涉及的内容都记录下来,其中有不妥之处还望大家指出,我会及时改正.望各位大神不吝赐教!同时,这也是我的第一篇前端技术博客,对博客编写还不是很熟悉,美 ...

深入学习jquery源码之attr()与removeAttr()

深入学习jquery源码之attr()与removeAttr()相关推荐

最新文章

热门文章