style设置/获取样式的问题 和 offsetWidth/offsetHeight的问题

style设置/获取样式的问题：
1.js通过style方法
    --加样式：加的是行间样式 oDiv.style.width="20"+'px';
    --取样式：取得是行间样式    alert(oDiv.style.width)
    --当css写在样式表里(即css全部写在行外)的时候获取不到 --alert(oDiv.style.width)是错误的
行内样式的优先级最高,当js通过style方法添加了样式之后,
js再通过修改class的值为同一元素增加样式,最终行内样式优先起作用,
在写js时最好统一只操作style或者class,不要同时操作

2.如何获取元素的行外样式:(样式全写在style标签里，或者一个.css 文件里)
    获取行外样式：
        IE: currentStyle
        Chrome,FF: getComputedStyle(oDiv,false).width
        兼容两个浏览器的写法:
        if(oDiv.currentStyle){
            alert(oDiv.currentStyle.width);
        }else{
            alert(getComputedStyle(oDiv,false).width);
        }
    *注:在解决很多兼容性写法时,都是用if..else..

    封装一个获取行外样式的函数:
        funtion getStyle(obj,name){
            if(obj.currentStyle){
                //IE
                return obj.currentStyle[name];
            }else{
                //Chrom,FF
                return getComputedStyle(obj,false)[name];
            }
        }
        调用：getStyle(oDiv,'width');

对于样式可分为：
    单一样式:width,height,font-size等
    复合样式：background,border
    而currentStyle只能取单一样式,无法取复合样式
    要想取：getStyle(oDiv,'backgroundColor');

3.通过js如何为元素修改class属性值/添加class属性
    js中任何标签的任何属性都可以修改,修改时HTML里面怎么写js里面就怎么写,
    document.getElementbyId('#box').style.background="red";
    document.getElementbyId('#box').href="demo.css";
    但是有一个例外,就是不可以这样修改class属性
    修改时应该为document.getElementbyId('box').className='bigBox';
    这样就为id为box的元素，添加了一个名为bigBox的class属性。
    因为class为html 里面的关键字/保留字,不可以修改,
    (所有的关键字/保留字都不可以修改)

4.js中两种操作属性的方法:
        1)oTxt.value="111111"
        2)oTxt['value']='1111'
    在所有操作属性的方法中,第一种方法都可以用第二种方法代替,但是第一种方法比较方便
    但元素属性作为函数的参数来传参时,操作属性只能用第二种方法,用第一种会有错误
        function change(name,val){
            var oDiv=document.getElementbyId('div');
            oDiv['style'][name]=value;
        }
    <div >    注:以后用offset时最好都换成使用这个函数,才不会出问题