• 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 );
                }
            }
        },

  • 相关阅读:
    爬虫-解析库-beautisoup
    爬虫-请求库-requests库
    爬虫-简单爬取视频
    爬虫基本原理
    虚拟环境搭建+前后端项目搭建
    flask-自定义命令、多APP应用、 wtforms、sqlalcchemy
    flask-蓝图
    flask- 偏函数、请求上下文、信号、flask-session保存redis中
    flash框架-安装、路由、配置、请求与响应
    svn服务器镜像备份
  • 原文地址:https://www.cnblogs.com/charling/p/3493165.html
Copyright © 2020-2023  润新知