jquery.parser.js 的 parseOptions 方法

// target 是DOM元素

// properties 是宿主的属性

$.parser.parseOptions(target,properties);

    /**
         * parse options, including standard 'data-options' attribute.
         * 
         * calling examples:
         * $.parser.parseOptions(target);
         * $.parser.parseOptions(target, ['id','title','width',{fit:'boolean',border:'boolean'},{min:'number'}]);
         */
        parseOptions: function(target, properties){
            var t = $(target);
            var options = {};
            
            var s = $.trim(t.attr('data-options'));
            if (s){
                if (s.substring(0, 1) != '{'){
                    s = '{' + s + '}';
                }
                options = (new Function('return ' + s))();
            }
            $.map(['width','height','left','top','minWidth','maxWidth','minHeight','maxHeight'], function(p){
                var pv = $.trim(target.style[p] || '');
                if (pv){
                    if (pv.indexOf('%') == -1){
                        pv = parseInt(pv) || undefined;
                    }
                    options[p] = pv;
                }
            });
                
            if (properties){
                var opts = {};
                for(var i=0; i<properties.length; i++){
                    var pp = properties[i];
                    if (typeof pp == 'string'){
                        opts[pp] = t.attr(pp);
                    } else {
                        for(var name in pp){
                            var type = pp[name];
                            if (type == 'boolean'){
                                opts[name] = t.attr(name) ? (t.attr(name) == 'true') : undefined;
                            } else if (type == 'number'){
                                opts[name] = t.attr(name)=='0' ? 0 : parseFloat(t.attr(name)) || undefined;
                            }
                        }
                    }
                }
                $.extend(options, opts);
            }
            return options;
        }

用到的方法

jQuery(elements)

将一个或多个DOM元素转化为jQuery对象。

attr(name)

取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined 。

jQuery.trim(str)

去掉字符串起始和结尾的空格。返回值:String

stringvar.substr(start [,length ])

一般截取字符串之前都会去掉前后空格。

jQuery.map(array, callback)

作为参数的转换函数会为每个数组元素调用,而且会给这个转换函数传递一个表示被转换的元素作为参数。转换函数可以返回转换后的值、null(删除数组中的项目)或一个包含值的数组,并扩展至原始数组中。

target.style[p]

获取DOM元素style属性的p样式的值

小结

  • data-options 为 plugin 设置属性
  • style 覆盖 data-options
  • properties 覆盖 style