先直接上源码吧:
(function($){ $.extend({ metadata:{ //默认配置 defaults:{ type:"class", //默认是class,插件支持elem name:"metadata", cre:/({.*})/, single:'metadata' }, /* setType目前支持设置两个参数,一个type,一个name */ setType:function(type,name){ this.defaults.type = type; this.defaults.name = name; }, /* get获取对应的数据 */ get:function(elem,opts){ //合并配置 var settings = $.extend({},this.defaults,opts); //怕opts里面外部配置single为'',强制置为metadata if(!settings.single.length){ settings.single = 'metadata'; } //一上来调用$.data看有没有缓存过的数据 var data = $.data(elem,settings.single); //如果有,直接返回,不重复劳动,节省效率 if(data){ return data; } //给一个默认值"{}" data = "{}"; if(settings.type == "class"){ //默认class方式:<p id="one" class="some_class {id: 1}">p</p> //从class去读数据,用cre正则去匹配 var m = settings.cre.exec(elem.className); if(m){ data = m[1]; } }else if(settings.type = "elem"){ //elem方式:<p id="one">p<script>{id:1}</script></p> //从elem去读数据 if(!elem.getElementsByTagName){ return undefined; } //比如上面用script作为数据源,那么name就得设置script var e = elem.getElemengtsByTagName(settings.name); if(e.length){ //核心还是innerHTML data = $.trim(e[0].innerHTML); } }else if(elem.getAttribute != undefined){ //自定义属性方向,通过getAttribute来获取数据源 //<p id="one" class="some_class">p</p> //name就设置为自定义属性的key var attr = elem.getAttribute(settings.name); if(attr){ data = attr; } } //data的类型转换!!! data = eval("(" + data + ")"); //调用$.data存一下 $.data(elem,settings.single,data); //把对象化的data返回 return data; } } }); $.fn.metadata = function(opts){ return $.metadata.get(this[0],opts); }; })(jQuery);