javascript - inserting variable into html page with innerhtml on page load -


i have inherited html page displays stats sales team. have inserted cut down version of here

<html> <head> <title>test</title> </head>  <body>   <br>    <div class="separator" style="clear: both; text-align: center;"></div><br>    <div>     <table border="2" cellpadding="10" cellspacing="0" style=     "background-color: white; border-collapse: collapse; text-align: center; width: 900px;">     <tbody>         <tr style=         "background-color: #f7941e; color: white; padding-bottom: 4px; padding-top: 5px;">         <th>             <div style="text-align: center;">               <span style=               "font-family: verdana, sans-serif; font-size: small;">total               accounts</span>             </div>           </th>          </tr>          <tr>           <td>             <div style="text-align: justify;">               <div style="text-align: center;">                 <span style=                 "color: #20124d; font-family: verdana, sans-serif; font-size: 75px; font-weight: bold;">                 200</span>               </div>             </div>           </td>         </tr>       </tbody>     </table>   </div> </body> </html> 

if can see sales figure 200. let;s have change "300".

the system use not display preview of table can edit, edit html directly hunting through code. i'd list variables @ top of page in javascript , have guys edit them there, rather hunting through code.

so like

<html> <head> <script>  myvar = "300"; document.getelementbyid('total_accounts').innerhtml = myvar; </script>   <title>test</title> </head>  <body>   <br>    <div class="separator" style="clear: both; text-align: center;"></div><br>    <div>     <table border="2" cellpadding="10" cellspacing="0" style=     "background-color: white; border-collapse: collapse; text-align: center; width: 900px;">     <tbody>         <tr style=         "background-color: #f7941e; color: white; padding-bottom: 4px; padding-top: 5px;">         <th>             <div style="text-align: center;">               <span style=               "font-family: verdana, sans-serif; font-size: small;">total               accounts</span>             </div>           </th>          </tr>          <tr>           <td>             <div style="text-align: justify;">               <div style="text-align: center;">                 <span id="total_accounts" style=                 "color: #20124d; font-family: verdana, sans-serif; font-size: 75px; font-weight: bold;"></span>               </div>             </div>           </td>         </tr>       </tbody>     </table>   </div> </body> </html> 

this way can list of variables @ top of page. unfortunately, doesn't work, displays no value in cell. have gone wrong?

thanks

assuming won't use jquery, script should be:

window.onload = function(){ myvar = "300"; document.getelementbyid('total_accounts').innerhtml = myvar;         }; 

here can how works: example


Comments

Popular posts from this blog

java - Oracle EBS .ClassNotFoundException: oracle.apps.fnd.formsClient.FormsLauncher.class ERROR -

c# - how to use buttonedit in devexpress gridcontrol -

nvd3.js - angularjs-nvd3-directives setting color in legend as well as in chart elements -