1. 

 简单的方法：

function rem(){ 
    document.getElement.style.fontSize=document.getElement.clientWidth/7.5+'px'
 }
window.onload=rem()//文档加载完成执行
window.onresize=rem()//当浏览器被重置大小时执行Javascript代码

可参考onresized的文档API

菜鸟教程onresize的相关教程

2.

复杂的方法：

自执行函数（designWidth, maxWidth）传入设计图宽度即可

(function(designWidth, maxWidth) {
    var doc = document,
        win = window,
        docEl = doc.documentElement,
        remStyle = document.createElement("style"),
        tid;
 
    function refreshRem() {
        var width = docEl.getBoundingClientRect().width;
        maxWidth = maxWidth || 540;
        width>maxWidth && (width=maxWidth);
        var rem = width * 100 / designWidth;
        remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
    }
 
    if (docEl.firstElementChild) {
        docEl.firstElementChild.appendChild(remStyle);
    } else {
        var wrap = doc.createElement("div");
        wrap.appendChild(remStyle);
        doc.write(wrap.innerHTML);
        wrap = null;
    }
    refreshRem();
 
    win.addEventListener("resize", function() {
        clearTimeout(tid);
        tid = setTimeout(refreshRem, 300);
    }, false);
 
    win.addEventListener("pageshow", function(e) {
        if (e.persisted) {
            clearTimeout(tid);
            tid = setTimeout(refreshRem, 300);
        }
    }, false);
 
    if (doc.readyState === "complete") {
        doc.body.style.fontSize = "16px";
    } else {
        doc.addEventListener("DOMContentLoaded", function(e) {
            doc.body.style.fontSize = "16px";
        }, false);
    }
})(640, 640);

3.可以给 html,body设置一个font-size:62.5%;

首先，rem是以html为基准。

一般的，各大主流浏览器的font-size默认值为16px,此时1rem=16px。如果此时将rem与px进行换算很麻烦，比如0.75rem=12px。

为了更方便的进行换算（比如1：10）

html,body{
  font-size: 62.5%;  
}

用rem定义尺寸的另一个好处是更能适应 缩放／浏览。

至于选择62.5%而非10px的原因，主要是兼容性和未来发展趋势的综合考虑，px这个单位的含义已经越来越混乱，几乎无法评估以后的设备是会一直像现在这样对网页上的px做兼容处理，还是让px回归“像素”的本意，但62.5%代表默认字体尺寸的62.5%这个含义基本不会有混乱。

4.如果是vue或者react可使用px2rem插件实现

可参考这篇文章