Comment utiliser une variable JavaScript dans un tableau de mise en page?

C'est mon code:

<html>
<script type="text/javascript">
    var data1 = "$100";
    var data2 = "$80";
</script>
<body>

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>

</body>
</html>

J'ai besoin de remplacer ce $100 & 80 $avec JavaScript variable de données 1 & données2

Comment faire?

  • Qu'entendez-vous par remplacer? basculer entre les 100$ et 80$ ?
  • Pas de simplement faire usage de variables 🙂
InformationsquelleAutor Coder_sLaY | 2012-03-27
  1. 9

    Si vous affectez ids pour les cellules que vous souhaitez

    <td id="data1">$100</td> 

<td id="data2">$80</td>

    Vous pouvez définir leur valeur en Javascript comme ceci

    document.getElementById("data1").innerHTML = data1;
document.getElementById("data2").innerHTML = data2;

    Vous pouvez le voir en action sur jsFiddle.

    InformationsquelleAutor Peter Olson
  2. 1

    Si je vous ai compris de droite, et que vous souhaitez remplacer, entre 100$ et 80$:

    var data1 = "$100";
var data2 = "$80";

var elements = document.getElementsByTagName('td');

for (var i = 0; i < elements.length; i++) {
    console.log(elements[i]);
    if (elements[i].innerHTML == data1) 
        elements[i].innerHTML = data2;
    else if (elements[i].innerHTML == data2) 
        elements[i].innerHTML = data1;
}​

    DÉMO

    InformationsquelleAutor gdoron is supporting Monica
  3. 0
    <html>
<script type="text/javascript">
    var data1 = "$100";
    var data2 = "$80";
</script>
<body>

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td onload="this.textContent=data1;"></td>
  </tr>
  <tr>
    <td>February</td>
    <td onload="this.textContent=data2;"></td>
  </tr>
</table>

</body>
</html>

    HTML5 n'a pas explicite databinding options, mais a données des balises pour insérer des métadonnées à des éléments du DOM. Plus d'infos

    Si vous avez toujours besoin d'un plus réactif moyen de lier vos données, vous pouvez essayer ce post

    InformationsquelleAutor David Diez