uot;>...... .innerDivClass {...}{...}{...}{ color: red; margin: 37px; padding: 10px; border: 2px solid #000000; height: 50px;
} .outerDivClass {...}{...}{...}{ padding: 100px; margin: 200px; border: 7px solid #000000; } </style>
<script>...... function checkClientHeight() ......{ var innerDiv = document.getElementById("innerDiv"); var outerDiv = document.getElementById("outerDiv");
result.innerHTML = "innerDiv.clientHeight: " + innerDiv.clientHeight + "<br />"; result.innerHTML += "innerDiv.offsetHeight: " + innerDiv.offsetHeight + "<br />"; result.innerHTML += "outerDiv.clientHeight: " + outerDiv.clientHeight + "<br />"; result.innerHTML += "outerDiv.offsetHeight: " + outerDiv.offsetHeight + "<br />"; } </script> </head> <body> <div id="outerDiv" class="outerDivClass"> <div class="innerDivClass" id="innerDiv"> Hello world. </div> </div> <p></p> <div id="result"> </div> <input type="button" onclick="checkClientHeight()" text="Click Me" Value="Click Me" /> </body> </html> |