判断

最新推荐文章于 2021-09-06 12:07:55 发布

转载最新推荐文章于 2021-09-06 12:07:55 发布 · 61 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/123wyy123wyy/p/6886664.html

本文提供了一个简单的示例代码，演示了如何通过点击按钮来动态调整网页中段落文字的字体大小，并限制了字体大小的最大和最小值。

1.点击减号，控制字体最小不能小于多小

2.点击加号，控制字体最大不能大于多大

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 5 <title>无标题文档</title>
 6 <script>
 7 window.onload = function (){
 8     var oBtn1 = document.getElementById('btn1');
 9     var oBtn2 = document.getElementById('btn2');
10     var oP = document.getElementById('p1');
11     var num = 16;
12     
13     oBtn1.onclick = function (){
14         if( num > 12 ){
15             num -= 2;
16             oP.style.fontSize = num + 'px';
17         }
18     };
19     oBtn2.onclick = function (){
20         if( num < 30 ){
21             num += 2;
22             oP.style.fontSize = num + 'px';
23         }
24     };
25 };
26 </script>
27 </head>
28 
29 <body>
30 
31 <input id="btn1" type="button" value="-" />
32 <input id="btn2" type="button" value="+" />
33 <p id="p1" style="font-size:16px;">10月28日晚，中央纪委监察部官网发布消息，贵州省委常委、遵义市委书记廖少华因涉嫌严重违纪违法接受组织调查。3天后中组部宣布对其免职。廖成为十八大后中纪委一连串"打虎"行动中第十一位落马的副省部级以上高官。</p>
34 
35 </body>
36 </html>

示例代码

转载于:https://www.cnblogs.com/123wyy123wyy/p/6886664.html