CODEWITHSUNDEEP
javascriptreactjs
Suraj Pawar
Suraj Pawar

Reputation: 43

How to concat string and add html tag to it?

I have string something like:

Lorem ipsum dolor sit amet, #consectetur and #adipiscing

I want to add html tag for hashtags which are present in the string. Expected Output is:

Lorem ipsum dolor sit amet, <a href="/users/tag/consectetur">#consectetur</a> and <a href="/users/tag/adipiscing">#adipiscing</a>

I am using javascript string operator split() and join(), but I am not getting the expected output.

    const string =  "Lorem ipsum dolor sit amet, #consectetur and #adipiscing" 
    
    function addHtmlTag(string){
       string = string.split("#").join('<a href="#/users/tag/">#</a>');
    return string
    }
console.log(addHtmlTag(string))

What will be the changes for adding html tag?

Upvotes: 4

Views: 591

Answers (3)

ProDec
ProDec

Reputation: 5410

It can replace with regexp

    const str = 'Lorem ipsum dolor sit amet, #consectetur and #adipiscing'
    const result = str.replace(/#(\w+)\b/g, '<a href="/users/tag/$1">#$1</a>')
    
    console.log(result)

Upvotes: 2

Sinan Yaman
Sinan Yaman

Reputation: 5937

You can use something like this:

const str = "Lorem ipsum dolor sit amet, #consectetur and #adipiscing"

const replacedStr = str.split(" ").map(word => (
  word[0] === "#" ? `<a href="/users/tag/${word.split("#")[1]}">${word}</a>` : word
)).join(" ")

console.log(replacedStr)

This searches for words that starts with "#" and append the a tag based on the word.

Upvotes: 3

Raoof Subi
Raoof Subi

Reputation: 21

You missed Double qutes ("")

const string =  "Lorem ipsum dolor sit amet, #consectetur and #adipiscing"

Upvotes: 0

Related Questions