javascript最常用的封装方法

最新推荐文章于 2023-05-19 15:59:11 发布

Java-interview

最新推荐文章于 2023-05-19 15:59:11 发布

阅读量192

点赞数

分类专栏： Java 文章标签： js javascript java

本文链接：https://blog.csdn.net/Ainanaya/article/details/115384220

版权

Java 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

1，获取链接上的参数

getQueryString = (name, search) => {
  search = search ||  window.location.search.substr(1) || window.location.hash.split("?")[1];
  let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
  let r = search.match(reg);
  if (r != null) return  unescape(r[2]); return null;
}

2、将数据导出为excel

function exportExcel(fileName, htmlStr) {
  if (!htmlStr) htmlStr = document.getElementsByClassName('tableWrapper')[0].outerHTML
  // 使用 outerHTML 属性获取整个 table 元素的 HTML 代码（包括<table>标签），
  // 然后包装成一个完整的HTML文档，设置 charset 为 urf-8 以防止中文乱码
  var html = "<html><head><meta charset='utf-8' /></head><body>" + htmlStr + '</body></html>'
  // 实例化一个Blob对象，其构造函数的第一个参数是包含文件内容的数组，第二个参数是包含文件类型属性的对象
  var blob = new Blob([html], {
    type: 'application/vnd.ms-excel'
  })
  var a = document.createElement('a')
  a.style.display = 'none'
  // 利用URL.createObjectURL()方法为 a 元素生成 blob URL
  a.href = URL.createObjectURL(blob)
  // 设置文件名
  a.download = `${fileName}.xls`
  document.body.appendChild(a)
  a.click()
  document.body.removeChild(a)
}

3、计算字符串宽度

function computeWidth(){
  let textBox:any = document.createElement('span');
  textBox.cssText = 'font-size: 18px;'
  textBox.innerText = '文字文字文字'
  document.body.appendChild(textBox);
  let width = textBox.offsetWidth;
  document.body.removeChild(textBox)
  return width+50+'px'
}

4.深拷贝

// 1、递归方式实现
function deepCopy(source,target) {
    for(var key in source){
        if(source.hasOwnProperty(key)){//只拷贝当前对象的属性
            if(source[key] && typeof source[key] == "object"){//如果属性是引用类型的对象
                // //根据原属性的类型决定是数组还是普通对象
                target[key] = Array.isArray(source[key]) ? [] : {};
                deepCopy(source[key],target[key]);//递归调用，完成所有层次的拷贝
            }else{
                target[key] = source[key];
            }
        }
    }
}
deepCopy(p1,p2);
 
// 2、借用JSON对象的parse和stringify
newobj = JSON.parse(JSON.stringify(obj))

5.文本复制

copyText(content) {
            if (!content) {
                console.log('文本不存在')
                return false
            }
            //创建一个input框存放需要复制的文本内容
            let copyUrl = document.createElement('input')
            copyUrl.setAttribute('value', content)
            document.body.appendChild(copyUrl)
            // 判断是在win还是ios
            if (navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) {
                let range = document.createRange()
                range.selectNode(copyUrl)
                window.getSelection().addRange(range)
            } else {
                copyUrl.select()
            }
            const isSuccess = document.execCommand('Copy')
            copyUrl.remove()
            return isSuccess
        },

6.判断鼠标坐标是否在元素里面

function mousePositionJudge(dom, e) {
    let oElement = dom
    let x1 = 0
    let y1 = 0
    for (x1 = 0, y1 = 0; oElement; oElement = oElement.offsetParent) {
        x1 += oElement.offsetLeft
        y1 += oElement.offsetTop
    }
    let x2 = x1 + dom.offsetWidth
    let y2 = y1 + dom.offsetHeight
    let x = e.pageX
    let y = e.pageY
    if (x > x1 && x < x2 && y > y1 && y < y2) {
        return true
    } else {
        return false
    }
}

Java-interview

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript最常用的封装方法

1，获取链接上的参数getQueryString = (name, search) => { search = search || window.location.search.substr(1) || window.location.hash.split("?")[1]; let reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); let r = search.match(reg); if (r != nul
复制链接

扫一扫