- 一个获取div中样式的问题
-
获取标签中的margin-top的值，使用document.getElementsByTagName("div").style.marginTop（有遍历）但只能得到内嵌样式的值，内联部分的值不能得到，具体代码如下：
<meta http-equiv="content-type" content="text/html;charset=utf-8"> <style> .mt1{margin-top:10px;} .mt3{margin-top:20px;} .mt4{margin-top:23px;} .mb1{margin-bottom: 60px;} .mb2{margin-bottom: 15px;} .mb4{margin-bottom: 5px;} </style> </head> <body> <div class="mt1 mb1"> <div id="flag" style="margin-top:15px"> <div class="mt3"> <div class="mt4"> ppppp <!-- ... --> </div> </div> </div> <!-- ... --> <p>content content content</p> <p>content content content</p> <!-- ... --> <div class="mb2"> <div style="margin-bottom:35px"> <div class="mb4">44444 <!-- ... --> </div> </div> </div> </div> <button onclick="js()"> dd</button> <script> function js() { var eles = document.getElementsByTagName("div"); for(var i=0;i<eles.length;i++){ alert(parseInt(eles[i].style.marginTop)); } }
<!DOCTYPE HTML>
<html>
<head>
<title>test</title>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"></script>
<style>
.mt1{margin-top:10px;}
.mt3{margin-top:20px;}
.mt4{margin-top:23px;}
.mb1{margin-bottom: 60px;}
.mb2{margin-bottom: 15px;}
.mb4{margin-bottom: 5px;}
</style>
</head>
<body>
<div class="mt1 mb1">
<div id="flag" style="margin-top:15px">
<div class="mt3">
<div class="mt4">
ppppp
</div>
</div>
</div>
<!-- ... -->
<p>content content content</p>
<p>content content content</p>
<!-- ... -->
<div class="mb2">
<div style="margin-bottom:35px">
<div class="mb4">44444
<!-- ... -->
</div>
</div>
</div>
</div>
<button onclick="js()"> dd</button>
</body>
<script type="text/javascript">
function js()
{
var eles = $("div");
$.each(eles,function(k,v){
alert(k+"-----"+$(v).css("margin-top"));
})
}
</script>
</html>
帮你用jq改写了一下。供参考。
