自学JS小实战之按钮设置字体大小事件

我们经常会在一些新闻网站上面查看文章的时候，都会发现文章的顶部一般都有设计按钮来设置字体大小，这样可以改善用户体验。

虽然这只是一个小效果，但是一个完整的网站都是由这些小效果组成的。

要实现的效果图：

只需要在页面放两个按钮和一个P标签：一个按钮用来增大字号，另一个按钮减小字号。

P标签主要用来放被设置的字体；

                <input id="bg" type="button" value="A+"/>
		<input id="lt" type="button" value="A-"/>
		<p id="p1">

                因主角全智贤、李敏镐而备受瞩目的韩剧《蓝色海洋的传说》已于本周上线两集，收视率16.4%轻松碾压其他水木剧。
		该剧讲述了地球上处于灭绝危机的最后一只人鱼遇到了都市的天才骗子后，在适应陆地生活的过程中发生的一系列故事。

               </p>

对于如何设置字体大小font-size，我们可以定义一个变量来放字体大小的值，对其自增/自减来达到效果。

         <script>
			var oB=document.getElementById("bg");
			var oL=document.getElementById("lt");
			var oP=document.getElementById("p1");
			var sum=15;
			function bigger(){
				sum++;
				oP.style.fontSize=sum+"px";//在JS中不能出现“-”符号
			}
			oB.οnclick=bigger;
			
			function small(){
				sum--;
				oP.style.fontSize=sum+"px";
			}
			oL.οnclick=small;
	 </script>

原文链接：https://blog.csdn.net/qq_19004625/article/details/53356255