Así que tengo un código HTML en el que quiero realizar un cálculo de resta básico entre las columnas 'Alto' y 'Bajo' en HTML. Recorrí la tabla html para completarla y, por lo tanto, intenté usar el código Javascript en el ciclo para que también pueda calcular automáticamente la diferencia. Pero no estoy obteniendo los resultados deseados. Cuando estoy imprimiendo los resultados a través de console.log, obtengo el mismo alto y bajo para cada iteración. No estoy seguro de por qué, ya que la tabla html está en bucle y la tabla está hecha correctamente
<table id='example' class='table'> <thead> <tr> <th>Stock</th> <th>Open</th> <th>High</th> <th>Low</th> <th>Close</th> <th>Volume</th> <th>Buyers</th> <th>Sellers</th> <th>Ratio</th> </tr> </thead> <tbody id="people"> {% for x,y in info.items %} <tr> <td scope="row">{{x|split}}</td> <td id= 'open'>{{y|access_dictionary:'ohlc'|access_dictionary:'open'}}</td> <td id='high'>{{y|access_dictionary:'ohlc'|access_dictionary:'high'}}</td> <td id='low'>{{y|access_dictionary:'ohlc'|access_dictionary:'low'}}</td> <td>{{y|access_dictionary:'ohlc'|access_dictionary:'close'}}</td> <td>{{y|access_dictionary:'volume'}}</td> <td id='buyquantity'>{{y|access_dictionary:'buy_quantity'}}</td> <td id='sellquantity'>{{y|access_dictionary:'sell_quantity'}}</td> <td id='ratio'></td> <script> console.log(document.getElementById('high').innerHTML) console.log(document.getElementById('low').innerHTML) console.log(document.getElementById('open').innerHTML) d = document.getElementById('high').innerHTML - document.getElementById('low').innerHTML console.log(d) document.getElementById('ratio').innerHTML = d; </script> </tr> {% endfor %} </tbody> </table>Señor, debe tener una identificación única para seleccionar el elemento en Javascript.
Señor, pruebe este código a continuación. Cambio un poco el código. No he probado el siguiente código:
<table id='example' class='table'> <thead> <tr> <th>Stock</th> <th>Open</th> <th>High</th> <th>Low</th> <th>Close</th> <th>Volume</th> <th>Buyers</th> <th>Sellers</th> <th>Ratio</th> </tr> </thead> <tbody id="people"> {% for x,y in info.items %} <tr> <td scope="row">{{x|split}}</td> <td id='open{{x}}'>{{y|access_dictionary:'ohlc'|access_dictionary:'open'}}</td> <td id='high{{x}}'>{{y|access_dictionary:'ohlc'|access_dictionary:'high'}}</td> <td id='low{{x}}'>{{y|access_dictionary:'ohlc'|access_dictionary:'low'}}</td> <td>{{y|access_dictionary:'ohlc'|access_dictionary:'close'}}</td> <td>{{y|access_dictionary:'volume'}}</td> <td id='buyquantity'>{{y|access_dictionary:'buy_quantity'}}</td> <td id='sellquantity'>{{y|access_dictionary:'sell_quantity'}}</td> <td id='ratio'></td> <script> console.log(document.getElementById('high{{x}}').innerHTML); console.log(document.getElementById('low{{x}}').innerHTML); console.log(document.getElementById('open{{x}}').innerHTML); d = Number(document.getElementById('high{{x}}').innerHTML) - Number(document.getElementById('low{{x}}').innerHTML) console.log(d); document.getElementById('ratio{{x}}').innerHTML = d; </script> </tr> {% endfor %} </tbody> </table>