全局属性函数和URL

全局属性函数

window.innerWidth(innerHeight) 返回窗口的文档显示的宽度，如果有水平滚动条，也包括滚动条宽度

注：元素.getBoundingClientRect().top/bottom 元素上边/下边距离视窗上边的距离

​ 元素.height指的是元素本身的高度，不包括padding、border、margin
​ 元素.innerHeight 包括元素自身的高度+padding部分
​ 元素.outerHeight() 元素自身高度 + padding + border
​ 元素. outerHeight(true) 元素自身高度 + padding + border +margin

​ 元素.clientHeight 元素高度+padding

​ 元素.offsetHeight 元素高度+padding+border+水平滚动条的高度，即除margin外都包括

​ 元素.scrollHeight 元素整体高度，包括不可见部分

​ 元素.offsetLeft 元素左上角距离父组件左边界的偏移量

属性

​ Infinity, NaN, undefined

函数

• decodeURI() 解码某个编码的URI

• decodeURIComponent() 解码一个编码的URI组件

• encodeURI()

• encodeURIComponent()

• escape() 对字符串进行编码

• unescape()

• eval() 计算JavaScript字符串，并把它作为脚本代码来执行

• isFinite() 检查是否为有穷大的数

• isNaN

• Number()

• parseFloat()

• parseInt()

• String()

• window.onbeforeunload()

  chrome,ie，Safari 火狐 支持 但无法自定义文字， 见功能场景一
  opera 不支持
  ie6,7 点击<a>标签会触发该事件
  

• window.location.reload() 刷新页面

注：URL(统一资源定位符)和URN(统一资源名称)是URI(统一资源标志符)的子集，因为URN没流行起来所以现在几乎所有URI都是URL

应用

拖拽函数

弹窗拖拽

基础拖拽 根据需求调整
listenDrag () {
   
  //父元素
  this.centerModalDom = document.querySelector('#center_modal')
  //子元素（可拖拽区域）
  this.titleTextDom = document.querySelector('#title_text')
  this.titleTextDom.onmousedown = (e) => {
   
    const mouseX = e.offsetX
    const mouseY =