前端最终规范


js常用方法

你如何验证参数是否为数字? function isNumber(n){ return !isNaN(parseFloat(n)) && isFinite(n); } 如何创建复制到剪贴板按钮?

document.querySelector("#copy-button").onclick = function() {
 // 选择内容
 document.querySelector("#copy-input").select();
 // 复制到剪贴板
 document.execCommand('copy');
};

如何展平多维数组?

const biDimensionalArr = [11, [22, 33], [44, 55], [66, 77], 88, 99];
const flattenArr = [].concat(...biDimensionalArr); // [11, 22, 33, 44, 55,

或者

function flattenMultiArray(arr) {
   const flattened = [].concat(...arr);
   return flattened.some(item => Array.isArray(item)) ? flattenMultiArray(flattened) : flattened;
}
const multiDimensionalArr = [11, [22, 33], [44, [55, 66, [77, [88]], 99]]];
const flatArr = flattenMultiArray(multiDimensionalArr); // [11, 22, 33, 44, 55, 66, 77, 88, 99]
Promise.allSettled(promises)
  .then((result) => console.log( // (D)
    result, 'result'));

替换 字符串中 img 的URL

export function  replaceImgUrl(content) {
    if (content.indexOf("IMG") != -1) {
      //判断img是否存在
       content.replace(
        /<IMG [^>]*src=['"]([^'"]+)[^>]*>/g,
        function (match, capture) {
          if (
            capture.indexOf("href") != -1 ||
            capture.indexOf("HREF") != -1
          ) {
            return content;
          } else {
            content = content.replace(
              capture,
              "http://121.196.19.68:8072/" + capture
            );
            return content.replace(
              capture,
              "http://121.196.19.68:8072/" + capture
            );
          }
        }
      );
      return content;
    } else if(content.indexOf("img") != -1){

     content.replace(
        /<img [^>]*src=['"]([^'"]+)[^>]*>/g,
        function (match, capture) {
          if (
            capture.indexOf("href") != -1 ||
            capture.indexOf("HREF") != -1
          ) {
            return content;
          } else {
            content = content.replace(
              capture,
              "http://121.196.19.68:8072/" + capture
            );
            return content.replace(
              capture,
              "http://121.196.19.68:8072/" + capture
            );
          }
        }
      );
      return content;

    } {
      return content;
    }
}

// 前端 通过链接 下载文件

downloadIamge(imgsrc, name) {
    //下载图片地址和图片名
    var image = new Image();
    // 解决跨域 Canvas 污染问题
    image.setAttribute('crossOrigin', 'anonymous');
    image.onload = function () {
        var canvas = document.createElement('canvas');
        canvas.width = image.width;
        canvas.height = image.height;
        var context = canvas.getContext('2d');
        context.drawImage(image, 0, 0, image.width, image.height);
        var _dataURL = canvas.toDataURL('image/png'); //得到图片的base64编码数据

        var blob_ = dataURLtoBlob(_dataURL ); // 用到Blob是因为图片文件过大时,在一部风浏览器上会下载失败,而Blob就不会

        var url= {
            name: name || "图片.png", // 图片名称不需要加.png后缀名
            src: blob_
        };

        if (window.navigator.msSaveOrOpenBlob) {   // if browser is IE
            navigator.msSaveBlob(url.src, url.name );//filename文件名包括扩展名,下载路径为浏览器默认路径
        } else {
            var link = document.createElement("a");
            link.setAttribute("href", window.URL.createObjectURL(url.src));
            link.setAttribute("download", url.name + '.png');
            document.body.appendChild(link);
            link.click();
        }
    };
    image.src = imgsrc;

    function dataURLtoBlob(dataurl) {
            var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new Blob([u8arr], { type: mime });
      }
}

替换img src

export function  replaceImgUrl(content) {
  if (content.indexOf("IMG") != -1) {
    //判断img是否存在
    var result = content.replace(
      /<IMG [^>]*src=['"]([^'"]+)[^>]*>/g,
      function (match, capture) {
        // console.log('capture.indexOf("href") ',capture )
        if (
          capture.indexOf("http") != -1 ||
          capture.indexOf("HTTP") != -1 

        ) {
          return content;
        } else {
          content = content.replace(
            capture,
            BASE_URL+capture
          );
          return content.replace(
            capture,
            BASE_URL+capture
          );
        }
      }
    );
    return content;
  } else if(content.indexOf("img") != -1){

    var result = content.replace(
      /<img [^>]*src=['"]([^'"]+)[^>]*>/g,
      function (match, capture) {
        if (
          capture.indexOf("http") != -1 ||
          capture.indexOf("HTTP") != -1
        ) {
          return content;
        } else {
          content = content.replace(
            capture,
            BASE_URL + capture
          );
          return content.replace(
            capture,
            BASE_URL + capture
          );
        }
      }
    );
    return content;

  } {
    return content;
  }
}

页面列表

ITEM_HTML