<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>wanshiok.com</p><p>wanshiok.com</p><p>wanshiok.com</p><p>wanshiok.com</p></div>