html - 渲染后突出显示页面上的文本

Question

我有一个应用程序，允许用户在多个字段中搜索字符串，当他们查看详细记录时，他们希望突出显示所有出现的字符串。

详细信息表单由 Labels 和 ListViews 组成，其中大部分位于 TabPanels 内部（来自 AJAX Control Toolkit）。我想避免使用蛮力手动解析每个值以在显示之前添加突出显示的标签。

有没有办法加载我的表单然后解析 HTML？还有其他方法吗？

Answer 1

JavaScript 和 JQuery 怎么样？ http://plugins.jquery.com/project/highlight

我刚刚尝试了那个插件并且它有效。您可以指定要突出显示的标签和单词。

<script language="javascript" type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.highlight-2.pack.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready( function () {
    $('p').each(function() { $.highlight(this, 'LOREM'); });
});
</script>
<style type="text/css">
    .highlight { background-color: yellow }
</style>

..
..
..
    <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi gravida risus elementum tortor. Duis mattis, est et volutpat cursus, mi mi ornare tortor, sed fringilla nibh erat sed eros. In nec orci vel velit scelerisque ultrices. Nunc auctor elit. Proin orci ligula, luctus a, venenatis sit amet, laoreet a, mauris. Suspendisse sem nibh, interdum eu, vestibulum non, semper vel, mauris. In quis leo suscipit risus semper pretium. Cras interdum iaculis dui. Etiam vel ipsum eu sapien dapibus sagittis. Donec lobortis, lectus et placerat euismod, quam dui porttitor sem, sed fermentum eros quam ac ipsum. Ut eu augue. Nullam lacinia dictum neque. Nullam eros. Phasellus sem nisi, feugiat nec, consectetur vel, ullamcorper at, nisl. Aenean quam risus, ullamcorper a, ultricies ut, posuere ac, quam. Vestibulum sed lectus ac orci fermentum viverra. Sed aliquam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
    </p>