如何javascript获取css中的样式
1 Javascript获取页面的元素的样式常见的两个方法是 document.getElementById(), document.querySelector("");方法。
2 在下面的实例中是使用Javascript来改变标签的背景颜色,使用的是document.querySelector()方法。代码可以直接复制到浏览器上面运行;document.querySelector("#demo").style.background = "red";是获取元素,使用css改变标签的北京颜色;<button onclick="myFunction()">点我</button>是点击事件触发,点击之后有相应的代码执行。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>javascript改变背景颜色</title>
</head>
<body>
<p id="demo">id="demo" 的 p 元素</p>
<button onclick="myFunction()">点我</button>
<script>
function myFunction() {
document.querySelector("#demo").style.background = "red";
}
</script>
</body>
</html>
3 案例加载之后的页面效果截图 :
4 点击点我按钮之后,北京颜色变为红色的效果截图:
我知道的两种,一种原生JS ,一种jquery 。
原生JS :
//获取obj 后,通过style可以获得,注意的是:css名字是驼峰写法
var obj =document.getElementById('id');
var left = obj.style.marginLeft
jquery :
$('selector').css('margin-left');
其他css属性类似。