如果正则表达式模式匹配，则字符串中的粗体单词

Question

如果正则表达式模式匹配，则字符串中的粗体单词

mrk*_*rks 4 html javascript css regex dom

主意：

我想突出显示字符串中的单词，如果它们是用大括号输入的（例如“Lorem {Ipsum} Sit Dolor”）。如果它们匹配，则应应用 font-weight：bold 。

到目前为止的方法：

var final = [];
var regExp = /([^{]*?)(?=\})/;
var string = document.getElementById("myParagraph").innerHTML;
wordArray = string.split(/\s+/);

for (var i = 0; i < wordArray.length; i++) {
    if (regExp.exec(wordArray[i])) {
        final.push(wordArray[i]);
    }
}
console.log(final);

Run Code Online (Sandbox Code Playgroud)

<body>
  <p id="myParagraph">This is a test string with a {bold} text. Lets {see} if this works</p>
</body>

Run Code Online (Sandbox Code Playgroud)

现在我明白了，我需要用 CSS 突出显示，并使用 jQuery.css() 执行 jQuery.each，但我现在不确定如何应用样式并自动“刷新”DOM。

Answer 1

syn*_*t1c 5

您可以使用String.prototype.replace并直接写入元素的innerHTML 来大大简化您的代码。

正则表达式也有点不同，因为我假设您不想将大括号保留在输出中，因此它们不会保留在捕获组中。

就样式而言，您可以将元素包装在具有特定类的跨度中，但我只是使用本机strong标记，因为它在语义上是正确的，并且默认情况下具有您想要的样式。

function bolderize(el) {
  el.innerHTML = el.innerHTML.replace(/{([^}]+)}/gm, '<strong>$1</strong>')
}
bolderize(document.getElementById('myParagraph'))

Run Code Online (Sandbox Code Playgroud)

<body>
  <p id="myParagraph">This is a test string with a {bold} text. Lets {see} if this works lol</p>
</body>

Run Code Online (Sandbox Code Playgroud)

归档时间：	9 年，1 月前
查看次数：	2906 次
最近记录：	9 年，1 月前