本文給大家分享js實現點擊按鈕字體放大縮小實例代碼，代碼簡單易懂，需要的朋友參考下吧
具體代碼如下所示：
<style>.bb{color:red;}.cc{color:green;}.chapter {font-size: 1.5em;}.normal{font-size:12px;}.hidden{display:none;}</style><script>$(document).ready(function() {$('div.aa').addClass('bb');$('a[href^="http:"]').addClass('cc');//$('#switcher-large').on('click',function(){// $('div.large').addClass('chapter'); //});$('#switcher-large').click(function(){ $('div.large').toggleClass('chapter');$(this).toggleClass('bb'); });//$('#switcher').click(function(){//點擊按鈕增加（移除）樣式（toggleClass方法）//$('#switcher button').toggleClass('hidden');//})//字體的放大縮小var $biger = $('div.large');var num = parseFloat($biger.css('fontSize')); $('#switcher-bigger').click(function(){ num=num*1.4;$biger.css('fontSize',num+'px');});$('#switcher-small').click(function(){num=num/1.4;$biger.css('fontSize',num+'px');});});</script><div id="switcher" class="switcher"><h3>Style Switcher</h3><button id="switcher-default"> Default </button><button id="switcher-hidden">Narrow hidden</button><button id="switcher-large">Large Print</button><button id="switcher-bigger">switcher-bigger</button><button id="switcher-small">switcher-small</button></div><div class="large"><p>VeVb武林網</p><p>VeVb武林網</p><p>VeVb武林網</p><p>VeVb武林網</p></div> 關于JavaScript實現點擊按鈕字體放大、縮小的相關知識就給大家介紹這么多，希望對大家有所幫助！
