Maison >interface Web >js tutoriel >Exemple de code de js attribuant une valeur à la table

Exemple de code de js attribuant une valeur à la table

高洛峰
高洛峰original
2016-12-29 16:29:002048parcourir

Exemple de code de js attribuant une valeur à la table

Exigence : Utilisez js pour attribuer une valeur à une table comme ci-dessus : (Définition X=70

[HTML]

<table class="table table-bordered">   
  <thead> 
    <tr> 
<th colspan="5" class="active">经济条件较好地区学费表</th> 
    </tr> 
    <tr> 
<th></th> 
<th>4-8人班</th> 
<th>2-3人班</th> 
<th>1人班</th> 
<th>10人以上</th> 
    </tr> 
  </thead> 
  <tbody data-json="area1"></tbody> 
</table> 
  
  
<table class="table table-bordered">   
  <thead> 
    <tr> 
<th colspan="5" class="active">经济条件较好地区学费表</th> 
    </tr> 
    <tr> 
<th></th> 
<th>4-8人班</th> 
<th>2-3人班</th> 
<th>1人班</th> 
<th>10人以上</th> 
    </tr> 
  </thead> 
  <tbody data-json="area2"></tbody> 
</table> 
  
<table class="table table-bordered">   
  <thead> 
    <tr> 
<th colspan="5" class="active">经济发达地区学费表</th> 
    </tr> 
    <tr> 
<th></th> 
<th>4-8人班</th> 
<th>2-3人班</th> 
<th>1人班</th> 
<th>10人以上</th> 
    </tr> 
  </thead> 
  <tbody data-json="area3"></tbody> 
</table>

[ JS]

<script> 
require(["jquery"], function($) { 
    var x=70; 
    var data = [ 
{name:"area1",content:{bei:[1,1.2,1.5,0.8],jia:[20,30,40,50]}}, 
{name:"area2",content:{bei:[1,1.2,1.5,0.8],jia:[20,30,50,60]}}, 
{name:"area3",content:{bei:[1,1.2,1.5,0.8],jia:[20,40,60,80]}} 
    ]; 
      
    $(data).each(function (i,item){ 
dom = &#39;&#39;; 
bei = item.content.bei; 
jia = item.content.jia; 
//加载第1行 
dom += &#39;<tr>&#39;; 
dom += &#39;<td>第1学年</td>&#39;; 
for(i=0;i<bei.length;i++){ 
  dom += &#39;<td>&#39;+ parseInt(x*bei[i]) +&#39;</td>&#39;; 
} 
dom += &#39;</tr>&#39;; 
//循环加载第2+行 
for(n=0;n<jia.length;n++){ 
  dom += &#39;<tr>&#39;; 
  dom += &#39;<td>第&#39;+(n+2)+&#39;学年</td>&#39;; 
  for(i=0;i<bei.length;i++){ 
    dom += &#39;<td>&#39;+ (parseInt(x*bei[i])+jia[n]) +&#39;</td>&#39;; 
  } 
  dom += &#39;</tr>&#39;; 
} 
$(&#39;[data-json="&#39;+item.name+&#39;"]&#39;).html(dom); 
    }) 
  
  }); 
}); 
    </script>

Ce qui précède est l'intégralité du contenu de l'exemple de code que l'éditeur vous a apporté pour que JS attribue une valeur à la table. J'espère que vous prendrez en charge le site Web PHP chinois ~

Plus d'exemples de JS pour attribuer une valeur à la table Pour les articles liés au code, veuillez faire attention au site Web PHP chinois


Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn