js改变div宽高注意点

1.div原本的宽度和高度需要写在style=“”里面,不要写在<style type="text/css"></style>里面,不然识别不了

2.使用document.getElementById("imgD").style.width获取的宽度是字符串类型,需要用parseInt()转换为整型

3.在设置宽度时,要加上'px',保证规范

代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function imgW() {
var w = document.getElementById("imgD");
var sw = w.style.width;
w.style.width = parseInt(sw)+20+'px';

            }
            function imgH(){
                var h = document.getElementById("imgD");
                var sh = h.style.height;
                h.style.height = parseInt(sh)+20+'px';
            }
    </script>
</head>
<body>
    <div id="imgD" style="margin: 0 auto;border: 1px solid red;width: 300px;height: 300px;">
    </div>
    <br />
    <input type="button" id="width" value="加宽" onclick="imgW()"/>
    <input type="button" id="height" value="加高" onclick="imgH()"/>
</body>

</html>

推荐阅读更多精彩内容