js-脚本化CSS

脚本化CSS

1.读写CSS属性

  • domEle.style.prop
    • 可读写行间样式,没有兼容性问题;像float这样的关键字属性应在前面加css。
    • float --> cssFloat;
    • 复合属性必须拆解,组合单词采用小驼峰式写法
    • 写入值必须是字符串格式

2.查询计算样式

  • window.getComputedStyle(ele,null)[prop]
    • 计算样式只读
    • 返回的计算样式的值都是绝对值,没有相对单位
    • IE8及其以下的版本不兼容
    • ()里第二个参数可以获取伪元素的样式
<style type="text/css">
		div{
			width:100px;
		}
		div::after{
			content: "";
			width:30px;
			height:30px;
			background-color:yellow;
			display:inline-block;
		}
	</style>
<script type = 'text/javascript'>
	window.getComputedStyle(ele,"after");
</script>
	```

- ele.currentStyle[prop]
	- 计算样式只读
	- 返回的计算样式值不是经过转换的绝对值
	- IE独有的属性
- 封装获取元素样式的方法getStyle:
```javascript
function getStyle(elem,prop){
	if(window.getComputedStyle){
			return window.getComputedStyle(elem,null)[prop];
		}else{
			return elem.currentStyle[prop];
		}
	}
   
上一篇:线性表 C语言实现


下一篇:运动函数