手写的一个兼容到ie6的提示更换浏览器的提示框

const content = `

  var isIE = !!window.ActiveXObject || "ActiveXObject" in window

  function isWeiXin(){

    var ua = window.navigator.userAgent.toLowerCase();

    if(ua.match(/MicroMessenger/i) == 'micromessenger'){

        return true;

    }else{

        return false;

    }

  }

  if(isIE || isWeiXin()) {

    var frag = document.createDocumentFragment()

    var dpnDialog = document.createElement('div')

    dpnDialog.id = 'dpn-dialog'

    document.body.style.background='#B0B0B0'

    function closeModal() {

      document.getElementById('dpn-dialog').style.display="none"

    }

    var modalInnerHTML = [

      '<div style="width:500px; height:300px; border: 1px solid #D9D9D9; position:absolute;top:50%;left:50%;margin-left:-250px;margin-top:-150px; border-radius: 5px; z-index:10;',

      '<div style="width:100%; height:50px; border-bottom: 1px solid #D9D9D9;"><span style="font-size:14px; line-height:50px;margin:0 12px;">⚠️ 系统检测</span></div>',

      '<div style="width:100%;height:250px;">',

      '<div style="width:100%;padding:36px 0px 72px 24px;font-size:14px;">当前浏览器与系统不匹配，请更换</div>',

      '<div style="width:100%;text-align: center;">',

      '<div style="width:250px;height:40px;line-height:40px;background:#4064F1;border-radius: 5px;cursor: pointer;margin: 0 auto 16px auto;"> <a style="display: inline-block;width: 250px;height: 40px;text-decoration: none;font-size:16px;line-height:40px; color: white;text-align:center; " href="">查看可用浏览器</a></div>',

      '<div style="width:250px;height:40px;line-height:40px;background:#F5F5F5;border-radius: 5px;cursor: pointer;margin: 0px auto;font-size:16px;color: blue;text-align:center;id="btn-close" onclick="closeModal() ">下次再说</div>',

      '</div> </div> </div>'

    ]

    dpnDialog.innerHTML = modalInnerHTML.join('')

    frag.appendChild(dpnDialog)

    document.body.appendChild(frag)

    frag = null

  }

`