Saya memiliki fungsi berikut:

function formattedTitle(posttitle,hreflink) {
  return `<a href='`+ hreflink +`'>` + posttitle.replace(/(^|\s)(#[-.\w]+)/gi, `$1</a><a class="hashtag" href='/search?q=hashtag:"$2"'>$2</a><a href='`+ hreflink + `'>`) + '</a>';
}

Saat aku berlari

console.log(formattedTitle('This is #awesome news','google.com'));

Ini menghasilkan:

<a href='google.com'>This is </a><a class="hashtag" href='/search?q=hashtag:"#awesome"'>#awesome</a><a href='google.com'> news</a>
function formattedTitle(posttitle, hreflink) {
  return `<a href='` + hreflink + `'>` + posttitle.replace(/(^|\s)(#[-.\w]+)/gi, `$1</a><a class="hashtag" href='/search?q=hashtag:"$2"'>$2</a><a href='` + hreflink + `'>`) + '</a>';
}


console.log(formattedTitle('This is #awesome news', 'google.com'));

Perhatikan bagaimana itu menyertakan "#" dalam kecocokan $2. Bagaimana saya bisa mengecualikan karakter tagar di atribut hashtag: tetapi menyimpannya di antara nilai href?

Jadi outputnya akan terlihat seperti:

<a href='google.com'>This is </a><a class="hashtag" href='/search?q=hashtag:"awesome"'>#awesome</a><a href='google.com'> news</a>

Saya dapat membuatnya berfungsi dengan melakukan penggantian lain pada semuanya untuk mengganti '/search?q=hashtag:"# dengan '/search?q=hashtag:" tetapi saya bertanya-tanya apakah itu mungkin tanpa penggantian kedua?

2
sudoExclaimationExclaimation 28 Oktober 2019, 05:46

3 jawaban

Jawaban Terbaik

Pindahkan # di luar grup ke-2 yang diambil, sehingga tidak ditangkap. Saat mengganti, di href, ganti dengan $2 saja (jadi tidak ada hashtag). Saat mengganti teks di dalam <a>, ganti dengan #$2, sehingga hashtag ditambahkan di tempat yang tepat:

function formattedTitle(posttitle, hreflink) {
  return `<a href='` + hreflink + `'>`
    + posttitle.replace(/(^|\s)#([-.\w]+)/gi, `$1</a><a class="hashtag" href='/search?q=hashtag:"$2"'>#$2</a><a href='` + hreflink + `'>`)
    + '</a>';
}

console.log(formattedTitle('This is #awesome news', 'google.com'));
2
CertainPerformance 28 Oktober 2019, 02:52

Cukup tambahkan grup penangkap lain sehingga Anda mendapatkan kecocokan dengan tagar (atau karakter lain yang ingin Anda tangkap) di $2 dan kecocokan lain tanpa tagar di $3: (#([-.\w]+)) daripada (#[-.\w]+):

function formattedTitle(postTitle, href) {
  const parts = postTitle.replace(
    /(^|\s)(#([-.\w]+))/gi,
    `$1</a><a class="hashtag" href="/search?q=hashtag:$3">$2</a><a href="${ href }">`);
  
  return `<a href="${ href }">${ parts }</a>`;
}

document.getElementById('postTitle').innerHTML = formattedTitle('This is #awesome news', 'https://google.com');
h3 {
  font-family: monospace;
  font-size: 24px;
  margin: 8px 0;
}

a {
  padding: 8px 0;
  text-decoration: none;
  display: inline-block;
}

.hashtag {
  padding: 6px 8px;
  border: 3px solid blue;
  border-radius: 3px;
  margin: 0 8px;
}
<h3 id="postTitle"></h3>
1
Danziger 28 Oktober 2019, 03:06

Anda hanya perlu memindahkan simbol hash dari grup tangkapan Anda; melakukannya tidak akan mengubah semantik yang cocok. Seperti:

function formattedTitle(posttitle, hreflink) {
  return `<a href='`+ hreflink +`'>` + posttitle.replace(/(^|\s)#([-.\w]+)/gi, `$1</a><a class="hashtag" href='/search?q=hashtag:"$2"'>$2</a><a href='`+ hreflink + `'>`) + '</a>';
}
1
Michael Horn 28 Oktober 2019, 02:53