<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
#div1 {
width: 100px;
height: 100px;
background: #000000;
padding: 50px;
border: 20px solid red;
margin: 30px;
}
</style>
</head>
<body>
<div id="div1">
</div>
<script src="../Script/jquery-2.1.1.js"></script>
<script type="text/javascript">
var oDiv = document.getElementById(‘div1‘);
oDiv.offsetHeight;//带border和带padding的高；
oDiv.clientHeight;//带padding，不带border的高
$("#div").height();//内容的高
$("#div1").innerHeight();//相当于clientHeight;
$("#div1").outerHeight();//相当于offsetHeight;
$("#div1").outerHeight(true);//相当于带margin，padding，border的
/*获取样式对象属性*/
var oStyle = getComputedStyle(oDiv, null);//获取所有的样式对象
//第一个参数是对象，第二个参数是获取哪一个，weinull就是所有的
console.log(oStyle.color);
console.log(oStyle.fontFamily);//IE6.7.8是不支持的
</script>
</body>
</html>
时间： 2024-09-29 17:23:07