如何使用GWT或Javascript强调DIV内部(innerText)的文本:

How to emphasize text inside (innerText) a DIV with GWT or Javascript:

本文关键字:innerText 文本 内部 DIV GWT 何使用 Javascript 强调      更新时间:2023-09-26

如何使用GWT或Javascript在div中强调文本:

Element content = DOM.createElement("div");
content.setInnerText(contentString);

哪个生成这个DIV:

<div>test message test message</div>

我希望能够用这个代码强调一些文本(例如"test"(:

<em>test</em>

因此div将如下所示:

<div>
  <em>test</em> message <em>test</em> message
</div>

您可以通过两个步骤轻松实现您想要的。

首先,不要使用setInnerText,因为它不会解释HTML。相反,您应该使用元素的.innerHTML属性。

其次,可以将所需单词替换为正则表达式。只需将你的单词包装在单词delemiter('b(之间。

最终代码如下:

content.innerHTML = contentString.replace(/'btest'b/g, '<em>test</em>');

如果您有多个单词要更改:

content.innerHTML = contentString.replace(/'b(test|other words)'b/g, '<em>$1</em>');

您不能只更改文本的一部分的格式,但您可以更改div的innerHTML以包含格式,正如您在下面的脚本部分中看到的那样。

<html>
 <body>
  <div id="mydiv">test message</div>
 </body>
 <script language="JavaScript">
  var mydiv = document.getElementById("mydiv");
  mydiv.innerHTML = mydiv.innerHTML.replace(new RegExp('test', 'g'), "<em>test</em>");
 </script>
</html>

GWT:

content.setInnerHTML(contentString.replaceAll("test", "<em>test</em>"))