Javascript: help with replacing '<div>' with '<br>' of an innerHTML!_问答_开发者

Javascript: help with replacing '<div>' with '<br>' of an innerHTML!

开发者 https://www.devze.com 2023-01-27 16:30 出处：网络

I have an edit开发者_运维问答able div where the user writes. As he writes, a javascript function adds the div html to a textarea. When the user presses SHIFT+Enter, the div gets a <br>. This is

I have an edit开发者_运维问答able div where the user writes. As he writes, a javascript function adds the div html to a textarea. When the user presses SHIFT+Enter, the div gets a <br>. This is good.

But when the user presses Enter alone, the div gets <div></div> tags.

Therefore I try to make it so that when Enter is pressed, javascript scans the div's html to eliminate the </div> and change the <div> for <br>. The result will be that regardless of whether the user presses SHIF+Enter or Enter, the div's html will end up using only <br> for linebreaks.

<head>
    <script type="text/javascript">
        function doStuff(e){
            if (window.event.keyCode == 13) {
                var s=document.getElementById("divv").innerHTML;
                s.replace("<div>", "<br>");
                s.replace("</div>", "");
                document.getElementById("divv").innerHTML=s;
            }
            document.getElementById("txtt").value = document.getElementById("divv").innerHTML;
        }
    </script>
</head>
<body>
    <div contenteditable="true" id="divv" onKeyUp=doStuff(event);">
        write here! Then press enter!
    </div>
    <textarea id="txtt" rows="30" cols="100">  
    </textarea>
</body>

My code doesn't work. When Enter is pressed, The textArea still shows div tags.

I'm not sure what I'm doing wrong. Please help.

The replace() method does not modify the string it's called on, it returns a new string with the occurrences replaced.

You can do something like:

var divv = document.getElementById("divv");
divv.innerHTML = divv.innerHTML.replace("<div>", "<br>").replace("</div>", "");

Usually browsers will have innerHTML store tags as <DIV> and </DIV> - you could try using:

s = s.replace(/<div>/ig,"<br>");
s = s.replace(/<\/div>/ig,"");

Firstly, if you use xhtml, you must use tag "< br / >".

Also draw attention on str.replace: it replaces only once.

js> var x = "hello";
js> x.replace("l", "L");
heLlo

Make your replace implementation:

js> function myreplace(str, pattern, change_to) {
var s = str;
var s2 = s;
do {
   s2 = s;
   s = s.replace(pattern, change_to);
} while (s2 != s);
return s;
}
js> myreplace("helllllo", "l", "L");
heLLLLLo