使用javascript在div中突出显示单词 [英] highlight word in div using javascript

查看:103
本文介绍了使用javascript在div中突出显示单词的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

您必须在我的项目中实现查找和替换功能。在此功能中,contenteditable div顶部有一个查找和替换按钮。当用户点击这个按钮时,弹出窗口会打开并在指定单词时询问搜索单词,然后按查找它只会在该div中找到单词。如果匹配发现它会突出显示该单词。所以有人告诉我,我怎样才能突出显示单词在div中。请紧急。

hi i have to implement find and replace functionality in my project. in this functionality there is one find and replace button on the top of contenteditable div. when user click on this button, popup window will open and ask for the search word when specify word and press find it will find word in that div only. and if match found it will highlight that word. so anybody tell me how can i highlight word in div. its urgent so please . thank you.

<div id="test" contenteditable="true">
this is test <font class='classname'> some text test</font>
</div>

我想高亮只测试单词而非其他

i want to high light only test word not else

推荐答案

使用原型库实际上非常简单:

Its actually pretty easy using the prototype library:

<html> 
    <head> 
        <style type="text/css">
            #content span {
                background-color: yellow;
            }
        </style>
        <script type="text/javascript" src="prototype.js"></script>
        <script type="text/javascript">
            Event.observe(window,'load',function(){
                var htm = $('content').innerHTML;
                $('content').innerHTML = htm.sub('my','<span>my</span>');
            });
        </script>
    </head>
    <body>

        <div id="content">
            This is the div containing my content.
        </div>

    </body>
</html>

这应该让你开始,所以你可以实现其余的。

This should get you started so you can implement the rest.

这篇关于使用javascript在div中突出显示单词的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆