实现图片的放大缩小

1先写三个按钮，创建图片，放大，缩小

---

<div id="div1">
			<button onclick="createImage()">创建图片</button>
			<button onclick="fangda()">放大</button>
			<button onclick="suoxiao()">缩小</button>
		</div>

2用js写三个对应的方法

每次点击放大或者缩小按钮获取上一次图片宽高的的值  

<script>
			function createImage(){
				var img1 = document.createElement("img")
				img1.src="img/10.jpg";
				img1.width=220;
				img1.height=300;
				img1.id="img1";
				document.getElementById("div1").appendChild(img1)
			
			}
			function fangda() {
			var img1 = document.getElementById("img1")
			var w1= img1.width;
			var h1 = img1.height;
			img1.width= parseInt(w1)+10
			img1.height = parseInt(h1)+10
			}
			function suoxiao() {
			var img1 = document.getElementById("img1")
			var w1= img1.width;
			var h1 = img1.height;
			img1.width= parseInt(w1)-10
			img1.height = parseInt(h1)-10
			}
		</script>

实现效果如下

放大效果如下

缩小效果如下

---

 

 

 

---

---