关于对DOM样式属性和方法的记录

（一）综合属性的有很多 例如： backgroundborder <div id="div" ></div> for(var i=0;i<oDiv.style.length;i++){      console.log(oDiv.style[i]); } /*===以下是chrome的输出结果===*/ 比我想象中输出的多，ie下没办法用这种方式访问，其余浏览器输出的也都不一致。虽然是综合属性，但是在用getPropertyValue方法时只返回内联里写入的值（除了火狐），只要清楚他返回的值在浏览器中存在差异就行了。 要从内联样式中移除用removeProperty方法，被移除的属性将恢复为默认样式（取决于用户代理）。这两个方法受到高版本的浏览器的支持。 （二）好玩的综合属性 在测试样式的过程中发现一件有趣的事。 例①：div的内联样式为background：red；      js：

          oDiv.style.background='blue';     //执行时间：0.105ms左右                         ↓替换成

          oDiv.style.backgroundColor='blue';      //执行时间：0.083ms左右 例①的代码已经很明显的说明综合属性在设置时的区别   例②：div的内联样式为background：0 0 no-repeat #77cc00；      js：           oDiv.style.background='blue';     //执行时间：0.149ms左右                          ↓替换成           oDiv.style.backgroundColor='blue';      //执行时间：0.203ms左右 例②说明在把综合的background替换成backgroundColor会在background：0 0 no-repeat #77cc00里搜索到他的颜色值加以替换，这样会比较费劲。为什么是搜索后替换background的颜色值而不是把background整个代替掉呢？ 例③：<div id="div" ></div>

          oDiv.style.backgroundColor='blue';          alert(oDiv.style.backgroundPosition);     //10px 10px

                                  

转载于:https://www.cnblogs.com/yomtaaa/p/4417730.html