Come cambiare il colore di sfondo della cella nella tabella usando lo script java

Ho bisogno di cambiare il colore di sfondo della singola cella nella tabella usando lo script java.Come cambiare il colore di sfondo della cella nella tabella usando lo script java

Durante il documento, ho bisogno che lo stile di tutte le celle sia lo stesso (in modo da usare il foglio di stile per aggiungere questo), ma al clic del pulsante ho bisogno di cambiare il colore della prima cella.

seguito è riportato il codice di esempio

<html lang="en"> 
    <head>  
    <script type="text/javascript" >   

    function btnClick() 
    { 
      var x = document.getElementById("mytable").cells; 
      x[0].innerHTML = "i want to change my cell color"; 
      x[0].bgColor = "Yellow";    
    } 
    </script> 
</head> 
    <style> 
    div 
    { 
    text-align: left; 
    text-indent: 0px; 
    padding: 0px 0px 0px 0px; 
    margin: 0px 0px 0px 0px; 
    } 
    td.td 
    { 
       border-width : 1px; 
       background-color: #99cc00; 
       text-align:center; 

    } 
    </style> 
    <body> 
    <div> 
    <table id = "mytable" width="100%" border="1" cellpadding="2" cellspacing="2" style="background-color: #ffffff;"> 
     <tr valign="top"> 
     <td class = "td"><br /> </td> 
     <td class = "td"><br /> </td> 
     </tr> 
     <tr valign="top"> 
     <td class = "td"><br /> </td> 
     <td class = "td"><br /> </td> 
     </tr> 
    </table> 
    </div> 
     <input type="button" value="Click" OnClick = "btnClick()"> 
    </body> 
</html>

fonte

2012-07-17 Kasma

Prova questo:

function btnClick() { 
    var x = document.getElementById("mytable").getElementsByTagName("td"); 
    x[0].innerHTML = "i want to change my cell color"; 
    x[0].style.backgroundColor = "yellow";    
}

Set da JS, backgroundColor è l'equivalente di background-color nel vostro foglio di stile.

Si noti inoltre che la raccolta .cells appartiene a una tabella riga, non alla tabella stessa. Per ottenere tutte le celle da tutte le righe è invece possibile utilizzare getElementsByTagName().

Demo: http://jsbin.com/ekituv/edit#preview

fonte

2012-07-17 06:37:21 nnnnnn

<table border="1" cellspacing="0" cellpadding= "20"> 
    <tr> 
    <td id="id1" ></td> 
    </tr> 
</table> 
<script> 
    document.getElementById('id1').style.backgroundColor='#003F87'; 
</script>

Put id per la cellula e quindi modificare sfondo della cella.

fonte

2014-01-10 10:10:45 Thilini

document.getElementById('id1').bgColor = '#00FF00';

sembra funzionare. Non credo che lo sia .style.backgroundColor.

fonte

2016-03-21 01:07:52 user3029797

Come cambiare il colore di sfondo della cella nella tabella usando lo script java

risposta

Problemi correlati