封装css框架 一、俩参数代码

//itcast 是自己封装的框架名称

itcast.fn.extend({
css:function(name,value){
//        只有一个参数的情况时肯定是查询
if(value ===undefined && typeof name ==="string"){

//            两种兼容方式,获取样式兼容  如ie 和其他浏览器
if(window.getComputedStyle){
//其他浏览器
var styles = window.getComputedStyle(this[0]);
return styles[name];
            }else {

//ie浏览器
return this[0].currentStyle[name];
            }
        }

//        设置值情况
this.each(function(){
//          传入的参数只有一个时  并且这个参数类型为object 对象那么就可以对这个对象进行遍历
传入的是一个对象
if(value === undefined && typeof name ==="object"){
for(var k in name){
//遍历对象 然后获取到对象的属性值,赋值给this.style[k](例div.style.width);
this.style[k] = name[k];
                }
            }else {
//第二个参数value,设置具体的值
this.style[name] = value;
            }
        })
//返回对象本身  便于连式编程
return this;
    }
})

itcast("div").css("width","3133px");
console.log(s);

相关推荐