<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- DW6 -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>shawl.qiu template</title>
<script type="text/javascript">
//<![CDATA[
onload=function(){
fHl(document.body, '英语');
}
/*----------------------------------------*\
 * 使用 javascript HTML DOM 高亮显示页面特定字词 By shawl.qiu
 * 参数说明:
 * o: 对象, 要进行高亮显示的对象.
 * flag: 字符串, 要进行高亮的词或多个词, 使用 竖杠(|) 分隔多个词 .
 * rndColor: 布尔值, 是否随机显示文字背景色与文字颜色, true 表示随机显示.
 * url: URI, 是否对高亮的词添加链接. 
\*----------------------------------------*/
//--------begin function fHl(o, flag, rndColor, url)------------------//
function fHl(o, flag, rndColor, url){
//var re=new RegExp(flag, 'i');
var temp;
var bgCor=fgCor='';
if(rndColor){
bgCor=fRndCor(10, 20);
fgCor=fRndCor(230, 255);
} else {
bgCor='yellow';
fgCor='black';
}
for(var i=0; i<o.childNodes.length; i++){
var o_=o.childNodes[i];
var o_p=o_.parentNode;
if(o_.nodeType==1) {
fHl(o_, flag, rndColor, url);
  } else if (o_.nodeType==3) {
if(!(o_p.nodeName=='A')){
if(o_.data.search(flag)==-1)continue;
temp=fEleA(o_.data, flag);
o_p.replaceChild(temp, o_);
}
}  // shawl.qiu script
}
//------------------------------------------------
function fEleA(text, flag){
var style=' style="background-color:'+bgCor+';color:'+fgCor+';" '
var o=document.createElement('span');
var str='';
var re=new RegExp('('+flag+')', 'gi');
if(url){
str=text.replace(re, '<a href="'+url+
'"'+style+'>$1</a>');
} else {
str=text.replace(re, '<span '+style+'>$1</span>');
}
o.innerHTML=str;
return o;
}  // shawl.qiu script
//------------------------------------------------
function fRndCor(under, over){
if(arguments.length==1){
var over=under;
under=0;
}else if(arguments.length==0){
var under=0;
var over=255;
}
var r=fRandomBy(under, over).toString(16);
r=padNum(r, r, 2);
var g=fRandomBy(under, over).toString(16);
g=padNum(g, g, 2);
var b=fRandomBy(under, over).toString(16);
b=padNum(b, b, 2);
//defaultStatus=r+' '+g+' '+b
return '#'+r+g+b;
function fRandomBy(under, over){
switch(arguments.length){
case 1: return parseInt(Math.random()*under+1);
case 2: return parseInt(Math.random()*(over-under+1) + under);
default: return 0;
}
} // shawl.qiu script
function padNum(str, num, len){
var temp=''
for(var i=0; i<len;temp+=num, i++);
return temp=(temp+=str).substr(temp.length-len);
} // shawl.qiu script
}
} // shawl.qiu script
//--------end function fHl(o, flag, rndColor, url)--------------------//
//]]>
</script>
</head>
<body>
<div>源可以是可移动媒体、当前 Windows 安装的系统目录中的任何目录、驱动器的根目录、本地安装源或 Cmdcons 目录,目标可以是除可移动媒体以外的任何与源相同的位置。如果没有指定目标,则默认为目录.Windows 安装 CD 中的压缩文件在复制过程中解压缩."
这样的一段文字,如何</div>
<div>源可以是可移动媒体、当前 Windows 安装的系统目录中的任何目录、驱动器的根目录、本地安装源或 Cmdcons 目录,目标可以是除可移动媒体以外的任何与源相同的位置。如果没有指定目标,则默认为目录.Windows 安装 CD 中的压缩文件在复制过程中解压缩."
这样的一段文字,如何</div>
如何来遍历这些文字,使得文字中的英语部分换个颜色呢?</span>
</body>
</html>

解决方案 »

  1.   

    建议你查询一下DOM手册,顺便学习一下ajax
      

  2.   

    倒, 看错意思,
    把调用改成这样: 
    fHl(document.body, '[a-zA-Z]+');
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <!-- DW6 -->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>shawl.qiu template</title>
    <script type="text/javascript">
    //<![CDATA[
    onload=function(){
    fHl(document.body, '[a-zA-Z]+');
    }
    /*----------------------------------------*\
     * 使用 javascript HTML DOM 高亮显示页面特定字词 By shawl.qiu
     * 参数说明:
     * o: 对象, 要进行高亮显示的对象.
     * flag: 字符串, 要进行高亮的词或多个词, 使用 竖杠(|) 分隔多个词 .
     * rndColor: 布尔值, 是否随机显示文字背景色与文字颜色, true 表示随机显示.
     * url: URI, 是否对高亮的词添加链接. 
    \*----------------------------------------*/
    //--------begin function fHl(o, flag, rndColor, url)------------------//
    function fHl(o, flag, rndColor, url){
    //var re=new RegExp(flag, 'i');
    var temp;
    var bgCor=fgCor='';
    if(rndColor){
    bgCor=fRndCor(10, 20);
    fgCor=fRndCor(230, 255);
    } else {
    bgCor='yellow';
    fgCor='black';
    }
    for(var i=0; i<o.childNodes.length; i++){
    var o_=o.childNodes[i];
    var o_p=o_.parentNode;
    if(o_.nodeType==1) {
    fHl(o_, flag, rndColor, url);
      } else if (o_.nodeType==3) {
    if(!(o_p.nodeName=='A')){
    if(o_.data.search(flag)==-1)continue;
    temp=fEleA(o_.data, flag);
    o_p.replaceChild(temp, o_);
    }
    }  // shawl.qiu script
    }
    //------------------------------------------------
    function fEleA(text, flag){
    var style=' style="background-color:'+bgCor+';color:'+fgCor+';" '
    var o=document.createElement('span');
    var str='';
    var re=new RegExp('('+flag+')', 'gi');
    if(url){
    str=text.replace(re, '<a href="'+url+
    '"'+style+'>$1</a>');
    } else {
    str=text.replace(re, '<span '+style+'>$1</span>');
    }
    o.innerHTML=str;
    return o;
    }  // shawl.qiu script
    //------------------------------------------------
    function fRndCor(under, over){
    if(arguments.length==1){
    var over=under;
    under=0;
    }else if(arguments.length==0){
    var under=0;
    var over=255;
    }
    var r=fRandomBy(under, over).toString(16);
    r=padNum(r, r, 2);
    var g=fRandomBy(under, over).toString(16);
    g=padNum(g, g, 2);
    var b=fRandomBy(under, over).toString(16);
    b=padNum(b, b, 2);
    //defaultStatus=r+' '+g+' '+b
    return '#'+r+g+b;
    function fRandomBy(under, over){
    switch(arguments.length){
    case 1: return parseInt(Math.random()*under+1);
    case 2: return parseInt(Math.random()*(over-under+1) + under);
    default: return 0;
    }
    } // shawl.qiu script
    function padNum(str, num, len){
    var temp=''
    for(var i=0; i<len;temp+=num, i++);
    return temp=(temp+=str).substr(temp.length-len);
    } // shawl.qiu script
    }
    } // shawl.qiu script
    //--------end function fHl(o, flag, rndColor, url)--------------------//
    //]]>
    </script>
    </head>
    <body>
    <div>源可以是可移动媒体、当前 Windows 安装的系统目录中的任何目录、驱动器的根目录、本地安装源或 Cmdcons 目录,目标可以是除可移动媒体以外的任何与源相同的位置。如果没有指定目标,则默认为目录.Windows 安装 CD 中的压缩文件在复制过程中解压缩."
    这样的一段文字,如何</div>
    <div>源可以是可移动媒体、当前 Windows 安装的系统目录中的任何目录、驱动器的根目录、本地安装源或 Cmdcons 目录,目标可以是除可移动媒体以外的任何与源相同的位置。如果没有指定目标,则默认为目录.Windows 安装 CD 中的压缩文件在复制过程中解压缩."
    这样的一段文字,如何</div>
    如何来遍历这些文字,使得文字中的英语部分换个颜色呢?</span>
    </body>
    </html>
      

  3.   

    谢谢btbtd(點點點...) ,正是想要这样的效果.
    最后再问一下,如果我想把!@#$%^<>?:{{}|()这种特殊符号的颜色也转换,上面的正则表达式应该怎么写啊