How to swap specific tags in string using javascript

Question

I have a string like

str = "< p>line 1< br>< /p>< p>lin2< br>< /p>< h1>line 3< br>< /h1>";

and i need to swap < br> with their immediate next closing tags which in the above case are < /p>, < /p> and < /h1>

so final str required is:

finalStr = "< p>line 1< /p>< br>< p>lin2< /p>< br>< h1>line 3< /h1>< br>";

I tried creating regex but was not successful. Can anyone guide how in this case i can create regex and swap the occurrences of br with the next closing tags only using JS ? PS: i have added extra space in all tags so that the html editor can ignore reading them as tags

Yangguang · Accepted Answer · 2016-03-16 06:54:41Z

2

you can try:

"< p>line 1< br>< /p>< p>lin2< br>< /p>< h1>line 3< br>< /h1>".replace(/(< br>)(< \/[\w\d]*>)/g,'$2$1')
//"< p>line 1< /p>< br>< p>lin2< /p>< br>< h1>line 3< /h1>< br>"

answered Mar 16, 2016 at 6:54

Yangguang

1,7859 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vikas Gupta Over a year ago

thanks, i do not have good understand of regex that is why needed a quick help..will learn more about creating regex

Arun P Johny · Accepted Answer · 2016-03-16 06:57:19Z

1

It is not a good idea to do dom manipulation using regex, instead you can try something like

str = "<p>line 1<br></p><p>lin2<br></p><h1>line 3<br></h1>";
var div = document.createElement('div');
div.innerHTML = str;

var brs = div.querySelectorAll('br');
[].forEach.call(brs, function(br) {
  br.parentNode.parentNode.insertBefore(br, br.parentNode.nextSibling)
});
snippet.log(div.innerHTML)

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

answered Mar 16, 2016 at 6:57

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

1 Comment

Vikas Gupta Over a year ago

I agree with you regarding dom manipulation, but actually intention was not to impact DOM, it was just to create some string out of DOM elements keeping DOM as it is.

mkHun · Accepted Answer · 2016-03-16 06:59:03Z

1

Simply try this

var str = "< p>line 1< br>< /p>< p>lin2< br>< /p>< h1>line 3< br>< /h1>";
var vca = str.replace(/<\sbr>(<\s\/\w>)/,"$1<br>");

answered Mar 16, 2016 at 6:59

mkHun

5,9479 gold badges45 silver badges96 bronze badges

Collectives™ on Stack Overflow

How to swap specific tags in string using javascript

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related