How to make sure that the pointer is not reset when the element changes?

  • 0
    I have a code like this
    <!DOCTYPE html>
    <html>
    <head>
    	<title></title>
    </head>
    <body>
     <p onkeyup="obr()" id="ds" contenteditable="true">
    var x = 0;</p>
     <script>
      function obr(){
       var text = document.getElementById("ds")
       text = text.innerHTML
       text = text.replace(/var/gi,"<span style='color:red;'>var</span>")
       document.getElementById("ds").innerHTML = text
     }
    </script>
    </body>
    </html>

    how to make sure that the pointer is not reset when data is being overwritten in the "p" tag
    JavaScript Anonymous, Jul 3, 2020

  • 1 Answers
  • 0
    <!DOCTYPE html>
    <html>
    <head>
    <title></title>
    </head>
    <body>
    <p onkeyup="obr()" id="ds" contenteditable="true">
    var x = 0;</p>
    <script>
    function obr(){
    var text = document.getElementById("ds")
    text = text.innerHTML
    text = text.replace(/var/gi,"<span style='color:red;'>var</span>")
    document.getElementById("ds").append(text);
    }
    </script>
    </body>
    </html>




    Or use textContent
    Anonymous

Your Answer
To place the code, please use CodePen or similar tool. Thanks you!