`
Gavin.Chen
  • 浏览: 325843 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

用JS实现网页多个关键字高亮显示

HTML 
阅读更多 
<html>
<head>
    <title>test</title>
    <script>
    function HighLight(nWord)
    { 
        if(nWord!='')
        { 
            var keyword = document.body.createTextRange(); 
            while(keyword.findText(nWord))
            { 
                keyword.pasteHTML("<span style='color:red;'>" + keyword.text + "</span>"); 
                keyword.moveStart('character',1); 
            } 
        } 
    } 
    function highword(nWord)
    { 
        var array = nWord.split(",");
        for(var i=0;i<array.length;i++)
        {
            HighLight(array[i]);
        }
    } 
    </script> 
</head>
<body onload="highword('Hello,body')">
    <p>Hello every body!</p>
</body>
</html>

 

分享到：
| 我常用的一个JNDI查找类，平进做EJB测试可 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jS 正则表达式实现关键字高亮显示

    在提供的`JS关键字高亮.html`和`正则 关键字高亮显示.html`文件中，很可能是演示了以上步骤的实例，展示了如何在网页中使用JS和正则表达式实现关键字高亮。 总之，利用JavaScript和正则表达式实现关键字高亮显示是...

    react-一个可以把文本中多个关键字高亮显示的react组件

    这个“react-一个可以把文本中多个关键字高亮显示的react组件”就是为了满足这样的需求而设计的。这个组件可以帮助开发者轻松地实现关键词高亮功能，提升用户在浏览和搜索文本时的体验。 首先，让我们了解React组件...

    用JS将搜索的关键字高亮显示实现代码

    这个函数的主要目的是接收一个包含多个关键字的字符串，然后遍历整个文档，找到这些关键字并将其高亮显示。`key`参数是以竖线（`|`）分隔的关键词列表。 ```javascript function highlight(key) { var key = key....

    JQuery 关键字高亮插件

    在Web开发中，我们经常需要实现文本中的关键字高亮显示，以便用户能快速找到他们关注的信息。jQuery作为一个强大的JavaScript库，提供了丰富的API和插件来帮助开发者实现这一功能。本篇文章将深入探讨一款名为...

    react中实现搜索结果中关键词高亮显示

    在React中实现搜索结果中关键词高亮显示的核心知识点可以分为几个部分： 1. 使用React组件的状态（state）和属性（props）进行交互。 2. 利用JavaScript的filter函数对数据进行过滤。 3. 使用正则表达式（RegExp）...

    js 关键字搜索高亮显示相关材料

    在JavaScript（JS）编程中，实现关键字搜索高亮显示是一项常见的需求，特别是在开发网页搜索功能或者富文本编辑器时。这个主题涉及到字符串处理、正则表达式和DOM操作等多个方面。下面将详细介绍如何使用JavaScript...

    textarea,textbox高亮关键字

    最近开发的时候做了textarea 高亮关键字,尝试过很多方法,比如用iframe,和编辑器替换,当然这也是一个方法,但是原来是用textbox的内容要达到兼容这两种方法是做不到的,所以这里是使用jquery插件和jquery核心文件搞的...

    jquery动态高亮关键字(可同时高亮多个)

    本教程将深入讲解如何使用jQuery实现动态高亮多个关键字的功能。 首先，我们要明白动态高亮的基本思路：遍历DOM树，查找包含关键字的元素，然后用特定的CSS样式（如背景色或边框）来突出这些关键字。jQuery提供了...

    页面关键字高亮实例

    实际应用中，可能还需要考虑更多细节，如性能优化（避免频繁操作DOM）、关键字的多样化处理（多个关键字，不同权重等）、防止HTML注入等。此外，还可以结合CSS3的伪类和过渡效果，让高亮效果更美观。总之，这是一个...

    php 多关键字 高亮显示实现代码

    在本文中，我们将探讨如何使用PHP实现对文本中的多个关键字进行高亮显示的功能。这项技术常用于搜索引擎、论坛系统等场景中，以帮助用户快速定位到他们感兴趣的内容部分。 #### 项目背景与目标 本项目的目标是通过...

    iOS关键字高亮

    在iOS开发中，关键字...总的来说，iOS中的关键字高亮涉及到了富文本处理、属性字符串、文本渲染等多个方面，开发者可以根据实际需求选择合适的方法来实现。通过合理的设计和优化，可以为用户提供更加友好的交互体验。

    javascript关键字实时自动高亮

    标题中的“javascript关键字实时自动高亮”指的是在网页中，通过JavaScript编程技术实现实时检测并高亮显示特定关键字的功能。这种技术常用于突出显示页面上的重要信息，提高用户阅读体验，尤其在文档、博客或者论坛...

    javascript网页关键字高亮代码

    通过上述分析，我们可以看到这个JavaScript关键字高亮代码实现了对网页文本中指定关键词的自动高亮效果，具有较好的实用性和扩展性。开发者可以根据具体需求调整关键词列表及其属性，进一步优化用户体验。此外，还应...

    开发小工具,支持高亮显示各种编程语言的关键字.

    1. **多语言支持**：一个强大的开发小工具应支持多种编程语言，如Java、Python、C++、JavaScript等，并为每种语言定制关键字高亮规则。 2. **自定义配色方案**：用户可以根据个人喜好和视觉需求选择或创建不同的颜色...

    js代码高亮显示 JavaScript代码高亮 jsp

    JavaScript代码高亮显示是网页开发中一个常见的需求，特别是在展示示例代码或编程教程时，高亮代码可以使代码更易读、更具有可读性。本文将深入探讨JavaScript代码高亮的相关知识点，以及如何在JSP（JavaServer ...

    jQuery.Mark插件实现搜索高亮显示文本关键字特效源码.zip

    jQuery.Mark插件是一款用于在网页文本中实现搜索关键字高亮显示的工具，它极大地简化了在HTML内容中突出显示匹配关键字的过程。这个插件基于流行的JavaScript库jQuery构建，旨在为用户提供一个直观且易于使用的解决...

    JavaScript正则方法replace实现搜索关键字高亮显示

    在实现搜索关键字高亮的场景中，replace方法能够通过正则表达式的捕获组功能，将匹配到的关键字替换为包含HTML标签的字符串，使得这些关键字在页面上以特定样式显示，从而达到视觉上的高亮效果。在上述提供的示例...

    前台实现文本框中c#关键字变色及提示

    在前端开发中，为了提升用户体验和代码编辑效率，经常需要实现一些特定的代码编辑功能，例如关键字高亮和代码提示。本资源包提供了一个解决方案，它包含三个JavaScript文件和一个HTML文件，用于在前端实现C#关键字...

    JavaScript实现关键字高亮功能

    4. **JavaScript高亮方法的实现**：通过编写一个名为`fHl`的函数，它接受四个参数：`o`表示要进行高亮显示的对象，`flag`是要高亮的关键词或多个关键词（多个关键词之间使用竖杠`|`分隔），`rndColor`是一个布尔值...

    代码高亮显示javascript插件

    在网页开发中，为了使代码片段更易于阅读和理解，我们常常使用代码高亮显示插件。"代码高亮显示JavaScript插件"是专门用于在Web页面中美化和突出显示JavaScript代码的工具，它能够将原始的黑白文本代码转换为具有...

Magicbox
Global site tag (gtag.js) - Google Analytics