1. 知识点

• contenteditable 属性可作用于html的节点上，取值为boolean类型，取值true时节点内容可编辑。
• getSelection / selection 页面元素选中

2. 使用

  ···
  <div id='fonts'>麦壳社区~</div>
  ···

  const _fonts = document.getElementById('fonts')
  _fonts.addEventListener("dblclick",function(){
     // 设置元素可编辑
     _fonts.setAttribute('contenteditable',true)
     if(window.getSelection){
        const range = document.createRange()
        range.selectNodeContents($(this)[0])
        window.getSelection().removeAllRanges() // 清楚其他的选中状态
        window.getSelection().addRange(range) // 添加元素选中住那个改
      }
  },false)

3. 小记

  // 获取当前选中内容
  if(window.getSelection){
     const selectRange = window.getSelection()
     const rangeTarget = selectRange.getRangeAt(0)
  }