如何使用Javascript动态增加字体大小，为什么当前的功能不起作用？

Question

我正在尝试使用javascript函数来增加页面的字体大小，但无法正常工作。 我的代码是否存在语法问题，或者无法执行我想做的事情？

使用Javascript：

function changeFontSize(fontvar) {
var div = document.getElementById("webchat_history");
var currentFont = div.style.fontSize.value;

div.style.fontSize = currentFont + fontvar+ "px";
}

HTML：
<span onClick="changeFontSize(10);" style="font-size:16px;">Aa</span>

我想通过x数量（fontvar）来增加它，而不是指定特定的字体大小，因为我的字体大小是在外部样式表中设置的。 当/如果我需要修改样式表，我宁愿不必也更新Javascript。

Answer 1

该脚本应该工作：

function changeFontSize(fontvar) {
    var div = document.getElementById("webchat_history");
    var currentFont = div.style.fontSize.replace("px", "");

    div.style.fontSize = parseInt(currentFont) + parseInt(fontvar) + "px";
}

Answer 2

我发现了这个惊人的脚本： https : //github.com/simplefocus/FlowType.JS

演示： http ： //simplefocus.com/flowtype/demo.html

Answer 3

经过额外的调试后，我意识到我使用的“ id” webchat_history实际上不是一个ID。 这是ID history的课程 。 我将创建其他类并使用document.getElementById('history').className = "webchat_history_medium"; 更改字体大小。