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>
网友评论