正则表达式搜索html返回，但不是实际的html jQuery
我正在为一个客户端制作一个突出显示的插件，以便在页面中查找内容，我决定使用帮助查看器进行测试，我仍在构建，但我遇到了一个问题（可能）需要一些正则表达式。
我不想解析HTML，并且我完全公开如何以不同的方式做到这一点，这似乎是最好的/正确的方式。
http://oscargodson.com/labs/help-viewer
http://oscargodson.com/labs/help-viewer/js/jquery.jhighlight.js
在搜索中键入内容…确定，刷新页面，现在键入，类， class或class="或键入<a你会注意到它将搜索实际的HTML（如预期的那样）。我怎样才能搜索文本？
如果我做.text()它会蒸发所有的HTML，我得到的只是一大块文本，但我仍然想要HTML所以我不会丢失格式，链接，图像等我想要这个像CMD / CTRL + F一样工作。
你可以使用这个插件：
$('article').jhighlight({find:'class'});
要删除它们：
.jhighlight('remove')
== ==更新
虽然迈克塞缪尔的想法下面确实有效，但这个插件有点沉重。 它主要面向希望在表单的“发布”过程中擦除坏词和/或MS Word字符的客户端。 我正在寻找一个更轻量级的解决方案，任何想法？
你真的不想使用eval，搞乱innerHTML或“手动”解析标记。 在我看来，最好的方法是直接处理文本节点并保留原始html的缓存以删除高亮显示。 快速重写，评论：
(function($){ $.fn.jhighlight = function(opt) { var options = $.extend($.fn.jhighlight.defaults, opt) , txtProp = this[0].textContent ? 'textContent' : 'innerText'; if ($.trim(options.find.length) < 1) return this; return this.each(function(){ var self = $(this); // use a cache to clear the highlights if (!self.data('htmlCache')) self.data('htmlCache', self.html()); if(opt === 'remove'){ return self.html( self.data('htmlCache') ); } // create Tree Walker // https://developer.mozilla.org/en/DOM/treeWalker var walker = document.createTreeWalker( this, // walk only on target element NodeFilter.SHOW_TEXT, null, false ); var node , matches , flags = 'g' + (!options.caseSensitive ? 'i' : '') , exp = new RegExp('('+options.find+')', flags) // capturing , expSplit = new RegExp(options.find, flags) // no capturing , highlights = []; // walk this wayy // and save matched nodes for later while(node = walker.nextNode()){ if (matches = node.nodeValue.match(exp)){ highlights.push([node, matches]); } } // must replace stuff after the walker is finished // otherwise replacing a node will halt the walker for(var nn=0,hln=highlights.length; nn
如果您在页面上进行任何操作，您可能希望用另一种清理机制替换缓存，但这并不简单。
你可以在这里看到代码： http ： //jsbin.com/anace5/2/
您还需要将display：block添加到新的html元素中，在几个浏览器上打破布局。
在javascript代码美化，我遇到了这个问题。 我想搜索文本但保留标签。
我所做的是从HTML开始，并将其分解为两位。
- 文字内容
- 成对（索引到标签出现的文本内容，标签内容）
所以给定
Lorem ipsum
我结束了
text = 'Lorem ipsum' tags = [6, '', 10, '']
这允许我搜索文本，然后根据结果开始和结束索引，生成HTML，仅包括该范围内的标签（和仅平衡标签）。
看看这里： getElementsByTagName（）等效于textNodes 。 您可以根据需要调整其中一个建议的解决方案（即迭代所有文本节点，随意替换单词 – 这在
我相信你可以做到：
$('#article :not(:has(*))').jhighlight({find : 'class'});
由于它抓取了文章中的所有叶节点，因此它需要有效的xhtml，也就是说，它只匹配以下示例中的链接 ：
This is some paragraph content with a link
DOM遍历/选择器应用程序可能会使事情变慢，因此可能会做得很好：
article_nodes = article_nodes || $('#article :not(:has(*))'); article_nodes.jhighlight({find : 'class'});
可能会有所帮助
>+[^<]*?(s(<[\s\S]*?>)?e(<[\s\S]*?>)?e)[^>]*?<+
第一部分>+[^<]*? 找到最后一个标记的>
第三部分[^>]*?<+找到第一个后续标记的<
在中间我们有(<[\s\S]*?>)? 在我们的搜索短语的字符之间（在这种情况下 - “看”）。
在正则表达式搜索之后，您可以使用中间部分的结果来突出显示用户的搜索短语。