【发布时间】:2019-07-04 09:54:48
【问题描述】:
我想用 HTML 标记从字符串中包装一个句子,脚本会收到一个字符串,然后它应该返回一个字符串,其中包含包含在 HTML 标记中的单词,例如
输入:
This is a sentence
输出:
This is a <strong>sentence</strong>
【问题讨论】:
标签: javascript html string ecmascript-6
我想用 HTML 标记从字符串中包装一个句子,脚本会收到一个字符串,然后它应该返回一个字符串,其中包含包含在 HTML 标记中的单词,例如
输入:
This is a sentence
输出:
This is a <strong>sentence</strong>
【问题讨论】:
标签: javascript html string ecmascript-6
replace()以下演示
⬥ 使用正则表达式方法replace(),
⬥ 使用 RegExp 对象作为动态变量搜索键,
⬥ 具有彻底的输入转义,
⬥ 能够找到给定搜索键的所有匹配项,
⬥ 它用<mark> 元素包裹匹配的文本(可以很容易地更改为<strong>)。
findText(selector, key);
第一个参数是要搜索的文本元素的选择器字符串。语法与 CSS/jQuery 选择器完全一样:
"#id", ".class", "tagName", "[name=name]"
第二个参数是字符串形式的搜索关键字。
function findText(selector, key) {
var node = document.querySelector(selector);
var str = node.textContent;
var esc = `(?!(?:[^<]+>|[^>]+<\\/a>))\\b(${key})\\b`;
var rgx = new RegExp(esc, "g");
var txt = str.replace(rgx, `<mark>$1</mark>`);
return node.innerHTML = txt;
}
findText('p', 'Duis');
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
【讨论】:
是的,只需使用replace:
var input = prompt("Enter a sentence");
var boldTest = "sentence";
document.write(input.replace(boldTest, `<strong>${boldTest}</strong>`));
在上面的示例中,boldTest 是您要替换的任何单词。
【讨论】: