有人可以帮助我使用javascript函数,可以突出显示网页上的文本.并且要求是 - 仅突出显示一次,而不是像在搜索的情况下突出显示所有出现的文本.
我有一个具有挑战性的问题要解决.我正在编写一个以正则表达式作为输入的脚本.然后,此脚本在文档中查找此正则表达式的所有匹配项,并将每个匹配项包装在其自己的<span>元素中.困难的部分是文本是格式化的html文档,因此我的脚本需要在DOM中导航并同时在多个文本节点上应用正则表达式,同时确定在必要时拆分文本节点的位置.
例如,使用正则表达式捕获以大写字母开头并以句点结尾的完整句子,本文档:
<p>
<b>HTML</b> is a language used to make <b>websites.</b>
It was developed by <i>CERN</i> employees in the early 90s.
<p>
Run Code Online (Sandbox Code Playgroud)
会变成这样:
<p>
<span><b>HTML</b> is a language used to make <b>websites.</b></span>
<span>It was developed by <i>CERN</i> employees in the early 90s.</span>
<p>
Run Code Online (Sandbox Code Playgroud)
然后该脚本返回所有已创建的跨度的列表.
我已经有一些代码可以找到所有文本节点,并将它们存储在列表中,以及它们在整个文档中的位置及其深度.你真的不需要理解代码来帮助我及其递归结构可能有点令人困惑.Ť 他我不知道该怎么办第一部分是搞清楚哪些元素应包括在范围之内.
function SmartNode(node, depth, start) {
this.node = node;
this.depth = depth;
this.start = start;
}
function findTextNodes(node, depth, start) {
var list = [];
var start = start || 0;
depth = (typeof depth …Run Code Online (Sandbox Code Playgroud) 如何使用document.execCommand?将字体大小更改为30px(例如)?
这个:
document.execCommand("fontSize", false, "30px");
Run Code Online (Sandbox Code Playgroud)
不起作用,因为在函数execCommand的第三个参数中,它只允许我在1到7之间输入一个值.
可能已经有人问过类似的问题,但请仔细阅读详细信息。
我正在使用一种自制的自动完成功能,现在我想突出显示结果集中的搜索词。到目前为止,这有效,但仅适用于纯文本。问题是:如果结果div中有一个,我需要保留html结构。请参阅我的示例:目前我正在丢失包含粗体的跨度。我怎样才能留住它们?
感谢您的任何建议!
$('#box').keyup(function () {
const valThis = this.value;
const length = this.value.length;
$('.objType').each(function () {
const text = $(this).text();
const textL = text.toLowerCase();
const position = textL.indexOf(valThis.toLowerCase());
if (position !== -1) {
const matches = text.substring(position, (valThis.length + position));
const regex = new RegExp(matches, 'ig');
const highlighted = text.replace(regex, `<mark>${matches}</mark>`);
$(this).html(highlighted).show();
} else {
$(this).text(text);
$(this).hide();
}
});
});Run Code Online (Sandbox Code Playgroud)
input[type="text"] {
width: 50%;
margin:10px;
padding: 5px;
float:left;
clear:left;
}
div{
float:left;
clear:left;
margin:10px 10px;
}
.bold {
font-weight: …Run Code Online (Sandbox Code Playgroud)javascript ×3
html ×2
algorithm ×1
autocomplete ×1
editor ×1
execcommand ×1
highlight ×1
highlighting ×1
jquery ×1
regex ×1