谁来帮忙注释下每句Javascript代码的意思。

<script>
function fontChange() {
        var divv = document.getElementsByTagName("div")[0];
        var inputt = document.getElementById("inputt");
        var targetStr = divv.innerText|| divv.textContent; //
        var reg = new RegExp(inputt.value); //reg得到什么值？ 

        
           var result = targetStr.replace(reg, function(a, b, c, d) {  //要求详细到每一个单词字母的意思。
            return "<span style='color:blue'>" + a + "</span>";  //要求详细
        });
          
        divv.innerHTML = result;
    }
</script><input id="inputt" onkeyup="fontChange();" value="sdgsdg">
    <div>xsvbngvhiuw3465483246hew</div>

解决方案 »

  1.   


       <script>
     function fontChange() {
       var divv = document.getElementsByTagName("div")[0]; 
       var inputt = document.getElementById("inputt"); 
       var targetStr = divv.innerText|| divv.textContent; // 
       var reg = new RegExp(inputt.value); //这里利用构造函数建一个正则模式，它的值为：'/inputt.value/'即'/sdgsdg/'；   var result = targetStr.replace(reg, function(a, b, c, d) { //在targetStr中搜索与reg中相匹配的字符，把他替换成函数的返回值；  
        return "<span style='color:blue'>" + a + "</span>"; //是一个匿名函数，传四个参数，最后返回的是一个<span style='color:blue'>a</span>标签  ；
     });       divv.innerHTML = result;
     } </script>
     
     <input id="inputt" onkeyup="fontChange();" value="sdgsdg"> 
     <div>xsvbngvhiuw3465483246hew</div>
    PS：我也是刚学JS不久，解释的不好请见谅。还请高手指教！
      

  2.   

     function fontChange() {
       var divv = document.getElementsByTagName("div")[0]; //获取第一个div
       var inputt = document.getElementById("inputt"); //获取id=inputt的标记
       var targetStr = divv.innerText|| divv.textContent; // 
       var reg = new RegExp(inputt.value); //这里利用构造函数建一个正则模式，它的值为：'/inputt.value/'即'/sdgsdg/'；   var result = targetStr.replace(reg, function(a, b, c, d) { //在targetStr中搜索与reg中相匹配的字符，把他替换成函数的返回值；  
        return "<span style='color:blue'>" + a + "</span>"; //是一个匿名函数，传四个参数，最后返回的是一个<span style='color:blue'>a</span>标签  ；
     });       divv.innerHTML = result;//修改divv内部的innerHTML 
     }
      

  3.   


    <!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">
    <head>
    <meta charset="utf-8">
    <style>
    </style>
    </head>
    <body>
    <script>
    function fontChange() {
            var divv = document.getElementsByTagName("div")[0];
            var inputt = document.getElementById("inputt");
            var targetStr = divv.innerText|| divv.textContent; //
            var reg = new RegExp(inputt.value); //reg得到的是一个用inputt的值作参数来创建的正则表达式。
            //具体可以参考 RegExp对象 new RegExp(pattern, attributes);
    //这里只传入了第一个参数，所以只能找到第一个匹配的字符。
    //http://www.w3school.com.cn/js/jsref_obj_regexp.asp
            
               var result = targetStr.replace(reg, function(a) {  
                return "<span style='color:blue'>" + a + "</span>";  
            });
    //stringObject.replace(regexp/substr,replacement)
    //regexp/substr   规定子字符串或要替换的模式的 RegExp 对象。
    //replacement   规定了替换文本或生成替换文本的函数。 他这里只用到了第一个参数是是匹配模式的字符串。
            //具体可以参考 replace方法  http://www.w3school.com.cn/js/jsref_replace.asp  

            divv.innerHTML = result;
        }
    </script><input id="inputt" onkeyup="fontChange();" value=""><!-- 你可以填一些基本的正则表达式，例如  [a-d]  [0-9] -->
        <div>xsvbngvhiuw3465483246hew </div>
    </body>
    </html>
      

  4.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
        <title>Confirm Before Leave</title>    <script type="text/javascript">
            function fontChange() {
                var divv = document.getElementsByTagName("div")[0];
                var inputt = document.getElementById("inputt");
                var targetStr = divv.innerText || divv.textContent; //
                var reg = new RegExp(inputt.value); //  /sdgsdg/ 这个是正则,用于匹配字符串xsvbngvhiuw3465483246hew
                var result = targetStr.replace(reg, function(a, b, c, d) {  ///在targetStr中搜索与reg中相匹配的字符，把他替换成函数的返回值；  
                                                                            ///a表示inputt.value的值；b表示在xsvbngvhiuw3465483246hew字符串中的位置索引，c表示字符串xsvbngvhiuw3465483246hew
                 
                    return "<span style='color:blue'>" + a + "</span>";  //如果有匹配就会蓝色高亮显示inputt.value的值
                });            divv.innerHTML = result;
            }
        </script></head>
    <body>
        <input id="inputt" onkeyup="fontChange();" value="sdgsdg" />
        <div>xsvbngvhiuw3465483246hew</div>
    </body>
    </html>