简化字体大小切换

Question

这是我在这里的第一篇文章。我想

我希望这个脚本只能在两种尺寸之间切换。

<script type="text/javascript">
var min=10;
var max=18;
function increaseFontSize() {

   var p = document.getElementsByTagName('td');
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {

         var s = 10;
      }
      if(s!=max) {

         s += 1;
      }
      p[i].style.fontSize = s+"px"

   }
}

function decreaseFontSize() {

   var p = document.getElementsByTagName('td');
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {

         var s = 10;
      }
      if(s!=min) {

         s -= 1;
      }
      p[i].style.fontSize = s+"px"

   }
}
</script>

如果有人可以删除我不需要的80％的脚本，那么我会非常高兴。 （不，真的，我是那个菜鸟。）

提前致谢。

Answer 1

你可以使用jQuery和一些CSS类很容易地完成它，比如：

http://jsfiddle.net/redders6600/e3FGs/

使用Javascript：

$('#small').click(function(){
  $('td').removeClass('big').addClass('small');
});

$('#large').click(function(){
  $('td').removeClass('small').addClass('big');
});

CSS：

td.small{
  font-size:10px;
}
td.big{
  font-size:18px;
}

Answer 2

可能你需要这个

<强> DEMO

<script type="text/javascript">
var min=10;
var max=18;
function togalFontSize() {

   var p = document.getElementsByTagName('td');
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
         if(s==max) {
              s = min;
          }else{
             s =  max;
          }
      } else {

         var s = 10;
      }

      p[i].style.fontSize = s+"px"

   }
}

</script>

或者如果你想要2个功能（可能是因为你有2个按钮可以在它们之间切换..） 的 DEMO 2

<script type="text/javascript">
var min=10;
var max=18;
function increaseFontSize() {

   var p = document.getElementsByTagName('td');
   for(i=0;i<p.length;i++) {

       p[i].style.fontSize = max+"px"

   }
}

function decreaseFontSize() {

   var p = document.getElementsByTagName('td');
   for(i=0;i<p.length;i++) {
      p[i].style.fontSize = min+"px"

   }
}
</script>