html5移動(dòng)端適配

//動(dòng)態(tài)改變font-size大小
(function changeFontSize() {
    let resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
    if (!isPC()) {
        let docEl = document.documentElement;
            // recalc = function () {
                let clientWidth = docEl.clientWidth;
                docEl.style.fontSize = 100 * (clientWidth / 375)  + 'px';
                let scaledFontSize = parseInt(window.getComputedStyle(docEl, null).getPropertyValue('font-size'));
                let scaleFactor = 100 * (clientWidth / 375) / scaledFontSize;
                let originRootFontSize = parseInt(window.getComputedStyle(document.documentElement, null).getPropertyValue('font-size'));
                docEl.style.fontSize = originRootFontSize * scaleFactor * scaleFactor + 'px';
            // };
    } else {
        let docEl = document.documentElement;
        docEl.style.fontSize = 'unset'
    }
    // if (!doc.addEventListener) return;
    window.addEventListener(resizeEvt, changeFontSize, false);
    document.addEventListener('DOMContentLoaded', changeFontSize, false);
})(document, window);

function isPC() {
    let userAgentInfo = navigator.userAgent;
    let Agents = ["Android", "iPhone",
        "SymbianOS", "Windows Phone",
        "iPad", "iPod"];
    let isPc = true;
    for (let i = 0;i< Agents.length; i++) {
        if (userAgentInfo.indexOf(Agents[i]) > 0) {
            isPc = false;
            break;
        }
    }
    if (document.documentElement.clientWidth <= 640) {
        isPc = false;
    }
    return isPc;
}

瀏覽器信息檢測

//判斷瀏覽器信息
function getNavigationInfo () {
    const ua = navigator.userAgent
    let browserInfo = {
        trident: ua.indexOf('Trident') > -1, // IE瀏覽器 trident內(nèi)核
        presto: ua.indexOf('Presto') > -1, // opera瀏覽器 presto內(nèi)核
        webKit: ua.indexOf('AppleWebKit') > -1, // chrome safari瀏覽器 webkit內(nèi)核
        gecko: ua.indexOf('Gecko') > -1 && ua.indexOf('KHTML') == -1, //firefox瀏覽器 gecko內(nèi)核
        mobile: !!ua.match(/AppleWebKit.*Mobile.*/), // 是否為移動(dòng)終端
        ios: !!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), // ios終端
        android: ua.indexOf('Android') > -1 || ua.indexOf('Linux') > -1, // android終端或UC瀏覽器
        iPad: ua.indexOf('iPad') > -1, //iPad終端
        webApp: ua.indexOf('Safari') == -1, //是否web應(yīng)用程序，沒有頭部與底部
        openOnVchat: ua.toLowerCase().match(/MicroMessenger/i) == "MicroMessenger".toLowerCase(), // 在微信中打開
        openOnWeiBo: ua.toLowerCase().match(/WeiBo/i) == "Weibo".toLowerCase(), // 在新浪微博客戶端打開
        openOnQQ: ua.toLowerCase().match(/QQ/i) == "QQ".toLowerCase(),// 在QQ端打開
    }
    return browserInfo;
}

文本可編輯

在文本標(biāo)簽上加上屬性contenteditable=“true”文章來源地址http://www.zghlxwxcb.cn/news/detail-826924.html

深拷貝對象

function deepClone(obj) {
  if (obj === null || typeof obj !== 'object') {
    return obj;
  }

  let clone = Array.isArray(obj) ? [] : {};

  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      clone[key] = deepClone(obj[key]);
    }
  }

  return clone;
}

到了這里，關(guān)于html5移動(dòng)端適配；檢測瀏覽器信息函數(shù)的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！