<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div id="e" contenteditable="true"> <div>12123 <span>23</span> </div> <ul> <li>123123</li> <li>123<i>wqe</i></li> </ul> </div> </body> <script> var e = document.getElementById('e') let selection = window.getSelection() let lastRange e.addEventListener('click', e => { let range = selection.getRangeAt(0); lastRange = range console.log(range) }) e.addEventListener('blur', e => { setTimeout(() => { selection.removeAllRanges(); let range = document.createRange(); range.setStart(lastRange.startContainer, lastRange.startOffset); range.setEnd(lastRange.endContainer, lastRange.endOffset); selection.addRange(range); }, 1000); }) </script> </html>