Javascript jQuery-重置所有字体大小

我正在编写一段代码，可以在单击时增大字体大小，在单击时减小字体大小，并在单击时重置字体大小。我通过以下方式将其应用于所有字体：

function convertAndApplyFonts(y) {
    $("body").find("*").each(function () {

        if (y == 'increase') {
            $(this).css({
                "font-size": parseInt($(this).css("font-size")) + 1
            });
        }

        if (y == 'decrease') {
            $(this).css({
                "font-size": parseInt($(this).css("font-size")) - 1
            });
        }

        if (y == 'reset') {
            var i = 0;
            $(this).css({
                "font-size": array[i]
            });

            i++;
        }

    });
}

在代码的开头，我有一个原始大小的数组：

var array = [];

$("body").find("*").each(function () {
    array.push($(this).css("font-size"));
});

我的问题是我在开始时生成的数组与我在y==reset时循环时生成的元素不匹配

我已经在我的第一个foreach和reset foreach中完成了console.log，它们的字体大小不匹配…我做错了什么

我还尝试了以下方法：

$("html").css({"font-size": counter + "em"});

---

但这并没有起到任何作用。

在所有元素中循环使用类似的内容根本不正确

---

为什么不能用rem代替px？这对你来说会容易得多&浏览器本身。使用rem单位，您只需修改html标记根元素的字体大小，就可以在一行代码中实现该行为，所有其他以rem而不是px表示的字体大小/填充等元素都将自动调整大小。

i始终为0？感谢吴先迭加，这有点帮助，但是没有解决我的问题，我如何使用rem而不是px？我可以看一个例子吗？我试过这个…$html.css{font-size:counter+em}；但是没有任何变化……在html元素的根级别设置字体大小。html{font size:15px；}例如，对于p元素，指定字体大小为1rem将计算为15px，指定h1为4rem将计算为60px，指定h2为3.5rem将计算为52.5px等，然后，您只需使用jQuery更改html的字体大小，其他所有内容都将相应调整大小。