有关JS显示本列相同字符的问题

本帖最后由 gouruhai 于 2012-07-14 15:04:23 编辑

解决方案 »

  1.   

    <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
    function init(){
    var table=document.getElementById("test");
    var tds=table.getElementsByTagName("td");
    for(var i=0;i<tds.length;i++){
    tds[i].setAttribute("num",i);
    tds[i].onclick=change;
    }
    }
    function change(){
    var table=document.getElementById("test");
    var num=this.getAttribute("num");
    var tds=table.getElementsByTagName("td");
    for(var i=num-3;i>=0;i-=3){
    if(tds[i].innerHTML==this.innerHTML){
    tds[i].innerHTML="<font color=red>"+tds[i].innerHTML+"</font>"
    }
    }
    this.innerHTML="<font color=red>"+this.innerHTML+"</font>";
    }
    window.onload=init;
    </script>
    </head>
    <body>
    <table id="test">
    <tr>
         <td>6</td>
            <td>7</td>
            <td>4</td>
        </tr>
        <tr>
         <td>8</td>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
         <td>5</td>
            <td>4</td>
            <td>5</td>
        </tr>
        <tr>
         <td>4</td>
            <td>5</td>
            <td>7</td>
        </tr>
        <tr>
         <td>5</td>
            <td>7</td>
            <td>7</td>
        </tr>
        <tr>
         <td>2</td>
            <td>1</td>
            <td>2</td>
        </tr>
        <tr>
         <td>4</td>
            <td>7</td>
            <td>5</td>
        </tr>
        <tr>
         <td>5</td>
            <td>2</td>
            <td>7</td>
        </tr>
    </table>
    </body>
    </html>
    这样试试
      

  2.   

    哈哈，小小，太谢谢你了。我今天才接触JS，在你的提点下，经过反复的研究你的方法，我完善了一下，达到了我的目的。的修改后如下：
    <!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
    function init(){
    var table=document.getElementById("test");
    var tds=table.getElementsByTagName("td");
    for(var i=0;i<tds.length;i++){
    tds[i].setAttribute("num",i);
    tds[i].onclick=change;
    }
    }
    function change(){ 
    var table=document.getElementById("test");
    var num=this.getAttribute("num");
    var tds=table.getElementsByTagName("td");
    for(var i=num-4;i>=0;i-=4){
    if(tds[i].innerHTML==this.innerHTML&&tds[i-4].innerHTML==tds[num-4].innerHTML){tds[i].innerHTML="<font color=red>"+tds[i].innerHTML+"</font>"
    tds[i-4].innerHTML="<font color=red>"+tds[i-4].innerHTML+"</font>"
    }
    }
    t=num-4;
    this.innerHTML="<font color=red>"+this.innerHTML+"</font>";
    tds[t].innerHTML="<font color=red>"+tds[t].innerHTML+"</font>";
    }
    window.onload=init; 
    </script>
    </head>
    <body>
    <table id="test">
      <tr>
      <td>2</td>
      <td>5</td>
      <td>4</td>
      <td>3</td>
      </tr>
      <tr>
      <td>7</td>
      <td>1</td>
      <td>5</td>
      <td>8</td>
      </tr>
      <tr>
      <td>5</td>
      <td>0</td>
      <td>4</td>
      <td>2</td>
      </tr>
      <tr>
      <td>1</td>
      <td>2</td>
      <td>5</td>
      <td>1</td>
      </tr>
       <tr>
      <td>9</td>
      <td>1</td>
      <td>2</td>
      <td>6</td>
      </tr>
       <tr>
      <td>2</td>
      <td>0</td>
      <td>3</td>
      <td>4</td>
      </tr>
       <tr>
      <td>7</td>
      <td>2</td>
      <td>5</td>
      <td>8</td>
      </tr>
       <tr>
      <td>5</td>
      <td>1</td>
      <td>2</td>
      <td>2</td>
      </tr>
    </table>
    </body>
    </html>