原生js获取css样式和修改css样式

行间样式可以使用div.style.width;但非行间样式就获取不到了(link引入或者嵌入式)
非行间样式获取可以使用
<div class="home-blog-area" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)">

<span class="date">时间: </span>
</div>

<script type="text/javascript">
function getStyle(obj,name){
if (obj.currentStyle) {
return obj.currentStyle[name];
}else{
return getComputedStyle(obj,false)[name];
}
}

function mouseOver(x){
var el=x.getElementsByClassName('date')[0];
el.style.cssText='background: url("http://172.16.0.117:8084/wp-content/themes/wallstreet/images/clock2.png") no-repeat;'

}
function mouseOut(x){
var el=x.getElementsByClassName('date')[0];
el.style.cssText='background: url("http://172.16.0.117:8084/wp-content/themes/wallstreet/images/clock.png") no-repeat;'
}
</script>

参考:https://www.cnblogs.com/webarn/p/6390334.html?utm_source=itdadao&utm_medium=referral

猜你喜欢

转载自www.cnblogs.com/zyx-blog/p/9328761.html