I have a table on a page, where there are text entries, and have one or more "hashtags", which I want to identify via JavaScript/JQuery and replace them with a link.
Currently I am using the following regex selector for hashtags: /#([a-zA-Z0-9]+)/g
I have been experimenting with replaceWith and replace methods of JQuery, but I couldn't achieve the desired result yet.
Example entries on the page:
<td class="entry">Had meeting with client #Project1</td>
This is my desired output (after manipulating via JavaScript/JQuery):
`<td class="entry">Had meeting with client <a href="search.php?`query=#Project1">#Project1</a></td>
Does someone help out with a function/for this? As my code is not close to working I am I choosing not to post the code..
You can do something like this using JavaScript:
const entries = document.querySelectorAll(".entry");
entries.forEach((entry) => {
entry.innerText.match(/#([a-zA-Z0-9]+)/g).forEach((hash) => {
entry.innerHTML = entry.innerHTML.replace(
hash,
`<a href="search.php?query=${hash}">${hash}</a>`
);
});
});<p class="entry">Had meeting with client #Project1</p>
<p class="entry">Had meeting with client #Project2 & #Project3</p>Maybe this solution will help ?
document.querySelectorAll("table td.entry").forEach((el) => {
el.innerHTML = el.innerHTML.replace(/#([a-zA-Z0-9]+)/g, '<a href="search.php?`query=#$1">#$1</a>')
})<table>
<tbody>
<td class="entry">Had meeting with client #Project1</td>
<td class="entry">Had meeting with client #Project2</td>
<td class="entry">Had meeting with client #Project3</td>
<td class="entry">Had meeting with client #Project4</td>
<td class="entry">Had meeting with client #Project5</td>
</tbody>
</table>try it:
const str= '<td class="entry">Had meeting with client #Project1</td>';
const match = str.match(/#([a-zA-Z0-9]+)/g);
var result = str.replace(match[0],`<a href="search.php?query=${match[0]}">${match[0]}</a>`);