`
icyheart
  • 浏览: 779446 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

javascript做的高亮效果

JavaScriptHTML 
阅读更多

方法一：

<script>
functionHighLight(nWord){ 

if(nWord!=''){ 

varkeyword=document.body.createTextRange(); 

while(keyword.findText(nWord)){ 

keyword.pasteHTML("<spanstyle='color:red;'>"+keyword.text+"</span>"); 

keyword.moveStart('character',1); 

}

}

}

functionhighword(nWord){ 

vararray=nWord.split(","); 

for(vari=0;i<array.length;i++){ 

HighLight(array[i]);

}

}
</script>


<bodyonload="highword('li,jin')"> 

<p>liujinzhongliujinzhongliuzhong</p>

</body>

 
方法二：

<html>
<head>
<title>TestPage</title>
<scripttype="text/javascript"> 
<!--
functionhighLight(ele,keys) 
{
varreg=newRegExp("("+keys.replace(/,/,"|")+")","g"); 

ele.innerHTML=ele.innerHTML.replace(reg,"<fontcolor=\"red\">$1</font>"); 
}

window.onload=function() 
{
highLight(document.getElementsByTagName("p")[0],"li,jin"); 
}
//--> 
</script>
</head>

<body>
<p>liujinzhongliujinzhongliuzhong</p>
</body>
</html>

 

 

 

分享到：
| 用javascript获取地址栏参数
评论
发表评论

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

相关推荐

    JavaScript 有Focus高亮效果的表单

    JavaScript 有Focus高亮效果的表单

    代码高亮显示javascript插件

    4. 用户自定义：开发者可以根据自己的喜好调整高亮样式，创建个性化的代码展示效果。 三、CodeMirror-2.22插件详解 CodeMirror是一个流行的开源代码编辑器组件，广泛应用于在线编辑器、代码示例和教程网站。Code...

    Google语法高亮JavaScript功能

    2. **示例**：示例文件展示了如何在实际项目中集成和使用该脚本，提供了各种语言的代码高亮效果，帮助开发者快速上手。 3. **教程文档**：Wiki教程文档详细介绍了如何配置和自定义语法高亮，包括选择主题、添加新的...

    javascript关键字高亮代码

    然后遍历这些关键词，并使用DOM操作将匹配到的文本包裹在一个带有特定样式的`&lt;span&gt;`标签中，从而实现高亮效果。 ```javascript var keys = [ ["", "http://www.baidu.com", "#ff0000"], ["ϵͳ", ...

    JavaScript点击高亮显示并显示属性信息

    一旦确定了目标，可以通过修改其样式属性，如填充色、边框宽度等来实现高亮效果。SuperMap iClient 6R提供了API方法来修改这些样式属性。 接着，我们讨论如何展示属性信息。在JavaScript中，popup通常指的是一个可...

    利用html高亮javascript语法

    代码高亮主要是通过给不同的编程元素（如关键字、变量、字符串等）赋予不同的颜色和样式，以增强代码的视觉效果。在HTML中，我们可以使用`&lt;pre&gt;`和`&lt;code&gt;`标签来保留代码的原始格式，并在此基础上应用样式。 接...

    JavaScript表格高亮选择特效.zip

    5. **可选：动画效果**：为了增加用户体验，还可以添加过渡动画，使高亮效果更平滑。这可以通过CSS3的`transition`属性实现。 在提供的压缩包中，"说明.htm"很可能是对实现这个特效的详细步骤和代码示例的解释，而...

    JavaScript语法高亮显示与语言自动检测和零依赖.zip

    JavaScript是一种广泛应用于网页和网络应用开发的脚本语言，它主要负责实现客户端的动态效果和交互功能。在网页中，JavaScript通常嵌入HTML文档中，或者通过外部JS文件链接引入。"JavaScript语法高亮显示与语言自动...

    使用 javascript 标记高亮关键词

     }在JavaScript中，对文本内容进行关键词高亮是一项常见的需求，特别是在搜索结果展示或者代码高亮时。本段代码提供了一个名为`MarkHighLight`的函数，它实现了对HTML元素内指定关键词的高亮标记功能。 首先，我们...

    果断收藏9个Javascript代码高亮脚本

    Chili是一个功能强大的jQuery代码高亮插件，它集成了多种编程语言的支持，并且提供了多个可配置的设置选项，允许开发者根据自己的需求调整高亮效果。 4. Lighter.js Lighter.js是一个基于MooTools框架的免费代码...

    纯CSS3实现DIV高亮显示特效

    "纯CSS3实现DIV高亮显示特效"是一种技术，它利用CSS3的特性，无需依赖JavaScript或图像，就能创建出吸引人的高亮效果。这篇文章将深入探讨如何使用CSS3来实现这一效果。 首先，我们要了解CSS3的一些基本概念。CSS3...

    jquery高亮插件（支持textarea内容高亮）

    **jQuery高亮插件——实现文本高亮与关键词查找** jQuery是一个广泛使用的JavaScript库，它极大地简化了HTML文档遍历、事件处理、动画以及...在全文检索应用中，结合关键词高亮，能更直观地展示结果，增强交互效果。

    高亮显示的图片展示效果.rar

    在事件处理函数中，我们可以修改图片的CSS样式以实现高亮效果。以下是一个简单的示例： ```javascript var images = document.getElementsByClassName('album-image'); for (var i = 0; i ; i++) { images[i]....

    javascript开发代码高亮预研报告

    本文将深入探讨JavaScript开发中的代码高亮技术，以及如何利用相关工具提升代码的展示效果。 **一、代码高亮的重要性** 1. **提高代码可读性**：通过使用不同的颜色和样式，代码高亮能够快速区分不同的语法元素，...

    2.（echarts篇）echarts颜色地图边缘高亮.zip

    本话题聚焦于“ECharts颜色地图边缘高亮”这一特性，下面将详细介绍如何在ECharts中实现地图的边缘高亮效果。 首先，地图的边缘高亮效果通常是为了增加视觉焦点，突出地图区域之间的边界，使地图更具有吸引力和...

    9个javascript语法高亮插件 推荐

    本文将介绍九款基于JavaScript实现的语法高亮插件，这些插件能够为各种编程语言提供良好的代码格式化和高亮效果。 1. **SyntaxHighlighter** SyntaxHighlighter是由Alex Gorbatchev开发的知名插件，广泛应用于博客...

    jQuerySyntax是一个JavaScript客户端语法高亮显示

    3. **应用到代码元素**：使用 jQuery 选择器找到需要高亮的代码元素，并调用 `.syntax()` 方法来应用高亮效果。 4. **加载语法源文件**：如果需要高亮显示的语言未预加载，可以使用 `.loadSyntax()` 方法动态加载。...

    js当前导航高亮带链接跳转效果

    接下来，我们使用JavaScript来实现导航高亮效果。我们可以监听窗口的`load`和`hashchange`事件，当页面加载或URL哈希值改变时，检查当前页面对应的链接元素，并为该元素添加一个高亮样式。 ```javascript window....

    Highlightjs是一个用JavaScript写的代码高亮插件

    Highlight.js 是一个强大的、轻量级的JavaScript库，专门用于代码高亮显示。这个插件不仅适用于前端开发，还可以在服务器端应用，为开发者提供了便捷的方式来美化网页中的代码块，使其更易读、更具吸引力。由于它不...

    JavaScript实现鼠标滑过高亮显示纵向3级白色的导航菜单源码

    在这个"JavaScript实现鼠标滑过高亮显示纵向3级白色的导航菜单源码"中，我们将深入探讨如何利用JavaScript来创建一个具有层次感的导航菜单，并在用户鼠标滑过时实现高亮效果。 首先，我们需要理解导航菜单的基本...

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