百度 前端 rem 适配 和 阿里 前端 rem 适配

阿里 

<script>
	var html = document.documentElement;
	window.rem = html.getBoundingClientRect().width / 37.5;
	html.style.fontSize = window.rem + 'px';
	</script>

阿里2 

<script>
	(function(doc, win) {
	var docEle = doc.documentElement,
	evt = "onorientationchange" in window ? "orientationchange" : "resize",
	fn = function() {
	var width = docEle.clientWidth;
	width && (docEle.style.fontSize = 10 * (width / 375) + "px")
	}
	win.addEventListener(evt, fn, false);
	doc.addEventListener("DOMContentLoaded", fn, false)
	}(document, window))
	</script>

 

百度

 (function () {
        var newFontSize = window.getComputedStyle(document.documentElement)['font-size'];
        var fontSizeScale = 16 / parseFloat(newFontSize.replace('px','')) ;
        //获取屏幕大小
        var html = document.documentElement;
        document.addEventListener('DOMContentLoaded', function () {
            resetRem();
            resetScreen();
        });
        window.addEventListener('load', function () {
            setTimeout(resetRem, 300);
            resetScreen();
        });
        window.addEventListener('resize', function () {
            setTimeout(resetRem, 300);
            resetScreen();
        });
        function resetRem() {
            html.style.fontSize = html.clientWidth / 20 * fontSizeScale + 'px';
            console.log(html.clientWidth);
            console.log(html.style.fontSize);
        }
        function resetScreen() {
            window.scrollTo(0,0);
//            var height = html.clientHeight || window.innerHeight;
//            var width = html.clientWidth || window.innerWidth;
//            document.querySelector('body').style.height = height + 'px';
//            document.querySelector('body').style.width = width + 'px';
//            document.querySelector('body').style.margin = 0;
//            document.querySelector('body').style.padding = 0;
        }
        resetRem();
    })();

转载于:https://www.cnblogs.com/itliulei/p/9223386.html