使用JavaScript突出显示文本并在突出显示的部分内创建粗体文本

时间:2014-02-13 16:59:15

标签: javascript range highlight

我已经在这里做了一些例子:[http://jsfiddle.net/8mdX4/731/] 但它并没有高亮显示所有选定的文字。它应该突出文字" m ipsum dolor sit ame"并制作大胆的文字" um dolor si"在突出显示的文本中,但文本" m ips"仍然没有突显出来。

有没有选项可以解决这个问题或做一些解决方法?

1 个答案:

答案 0 :(得分:1)

我刚刚在这个帖子中找到了解决方案:

https://groups.google.com/forum/#!topic/mozilla.dev.tech.dom/dQK0ioISIPM

这是一个非常简单的解决方法。我有一个应该突出显示的范围,突出显示范围内的多个范围应该用粗体显示。

首先,我必须处理制作粗体文本,因为如果我使用“document.execCommand(”BackColor“,false,color)高亮文本;”在那之前,它会以某种方式破坏我的“大胆范围”。

所以解决方案是用这样的元素替换或包装“粗体范围”的文本内容:

if (boldRange) {
   boldRange.deleteContents();
   var newContents = document.createElement('b');
   newContents.textContent = 'text that would be bolded';
   boldRange.insertNode(newContents)
}

示例如何工作在这里演示:

http://jsfiddle.net/8mdX4/733/