脚本化初识

一、脚本化:用JS去控制css样式
1、获取css样式
(1)获取行内样式
var style=div.style
style.width 获取的是style的宽的值
style.backgroundColor等同于css样式的background-color
(2)获取内部和外部
window.getComputedStyle(ele,null)只适用于IE9+等高版本浏览器,
而IE678则是用ele.currentStyle获取元素属性
2、设置css样式
我们只能设置或更改行内样式,内部和外部样式无法更改和设置
div.style.width=200px

二、用JS获取css里的数据
1、getComputedStyle()方法:获取的是元素最后应用到的那个值,eg:
var div=document.querySelector("div");
var style=getComputedStyle(div,null);
2、对于css的内部样式,js获取可以通过封装函数的方式来获取属性值,比如可利用getCssValue(ele,cssPropName)函数来获取一个属性它里面的属性值(ele表示这个元素,cssPropName表示属性名)
eg:function getCssValue(ele,cssPropName) {
var style=window.getComputedStyle ? window.getComputedStyle(ele,null) : ele.currentStyle;
return style[cssPropName];
}

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容