js加rem动态计算font-size,进行各种屏幕的适配

        (function (doc, win) {
            var docEl = doc.documentElement,
                resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function () {
                    var clientWidth = docEl.clientWidth;
                    if (!clientWidth) return;
                    docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
                };
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window);

1.var docEl=doc.documentElement----返回文档的根节点
2.resizeEvt = ‘orientationchange’ in window ? ‘orientationchange’ : ‘resize’
orientationchange----是在用户水平或者垂直翻转设备（即方向发生变化）时触发的事件。这里是判断窗口有没有orientationchange这个方法，有就返回orientationchange，没有就返回resize。
orientationchange的具体描述
3. var clientWidth = docEl.clientWidth----获取整个窗口的宽度
4. docEl.style.fontSize = 20 * (clientWidth / 320) + ‘px’;------iphone4宽度是320px，那么font-size就是20px, 100px就是5rem；iphone6宽度是375px，那么font-size就是23.4375px,100px就是4.267rem
5. win.addEventListener(resizeEvt, recalc, false);------绑定浏览器缩放与加载时间
6. doc.addEventListener(‘DOMContentLoaded’, recalc, false)当dom加载完成时，或者 屏幕垂直、水平方向有改变进行html的根元素计算

这篇文章更好一点，放上链接 https://blog.csdn.net/qq_43209768/article/details/93617137