Question

我设法将一个脚本组合在一起，该脚本将使用按钮或链接增加网页部分的字体大小。它适用于Moz / Chrome，但坚持使用IE，理论上它在这些主流浏览器中应该没有问题。但我坚持认为是否可以使用currentStyle从getElementsByName填充的变量中获取fontSize;当然，IE正在绘制空白。

这是我的剧本：

function changeFontSize(element,step)
{
    var styleProp = 'font-size';
    step = parseInt(step,10);

    var x = document.getElementsByName(element);

    for(i=0;i<x.length;i++) {

        if (x[i].currentStyle)  {
            var y = parseInt(x[i].currentStyle[styleProp],10);

        } else if (window.getComputedStyle) {           
            var y = parseInt(document.defaultView.getComputedStyle(x[i],null).getPropertyValue(styleProp),10);

        }

        x[i].style.fontSize = (y+step) + 'px';
    }
}

我曾经用过的3个网站是：

www.vijayjoshi.org

www.quirksmode.org

和（这不是垃圾邮件，这实际上很重要）//http：//www.white-hat-web-design.co.uk/blog/controlling-font-size-with-javascript/

有人能指出解决方案吗？提前谢谢！

Answer 1

如何使用以下代码更新代码：

function changeFontSize(element,step)
{
 function computeFontSizeUpdate(oE)
 {
 //- init fSize with proper null value
 var fSize = null;
 //- retrieve fSize from style
 if (oE.currentStyle)  {
     fSize = parseInt(oE.currentStyle[styleProp], 10);
 } 
 else if (window.getComputedStyle) {
     var s = document.defaultView.getComputedStyle(oE,null);
     fSize = (s) ? parseInt(s.getPropertyValue(styleProp),10) : NaN;
 }

 //- check fSize value based on return of parseInt function
 if( isNaN(fSize) == false && fSize != null)
 {
    fSize += nStep + 'px';
    if(oE.currentStyle)
      oE.currentStyle.fontSize = fSize;
    else
      oE.style.fontSize = fSize;
 }
 };

 var styleProp = 'font-size';
 var nStep = parseInt(step, 10);

 //- ensure step value
 if( isNaN(nStep) ) nStep = 0;

 //- get target elements
 var oElems = document.getElementsByName(element);

 if ( oElems && oElems.length == 0)
 {
   var oE = document.getElementById(element);
   if(oE) computeFontSizeUpdate(oE);
 }
 else
 {
   for(oE in oElems) 
   {
    computeFontSizeUpdate(oE);
   }
 }

}

我已经使用修复更新了脚本，并为一些变量更好地命名。

另外，我很抱歉因为我现在在Mac上，我无法在IE中测试提供的脚本......但是从我记得它应该可以做到这一点。

使用某些JS控制台，您可以直接在此页面上直接执行

changeFontSize("nav-tags", 50);

你会注意到菜单栏中的Tags元素会受到影响：）

希望这有帮助

Javascript增加/减少字体大小（外部CSS）

1 个答案: