Comptage des valeurs moyennes arithmétiques à partir des balises span

Question

Je travaille sur une application de téléchargement d'images, dans laquelle les utilisateurs peuvent noter les images. Lorsque trois utilisateurs ont donné des scores à l'image, le code HTML ressemble au code ci-dessous, et ce que je veux faire est de générer des valeurs moyennes arithmétiques à partir des différents paramètres (composition, contenu, technique) et les montrer aux utilisateurs .

Je suppose que je dois faire ce qui suit (lorsque la page est chargée):

1. obtenir les valeurs des différentes balises span et les ajouter à différentes variables (composition, contenu et technique)
2. diviser les valeurs des variables du nombre de postes de score
3. liste les valeurs à la page

Ce que je besoin d'aide est de savoir quand la page est chargée, et comment obtenir les valeurs des différentes balises span.

Merci d'avance!

<div id="scores"> 
     <strong>User1</strong> 
     <span class="composition">1</span> 
     <span class="content">2</span> 
     <span class="technique">3</span> 

     <strong>User2</strong> 
     <span class="composition">1</span> 
     <span class="content">3</span> 
     <span class="technique">4</span> 

     <strong>User3</strong> 
     <span class="composition">4</span> 
     <span class="content">5</span> 
     <span class="technique">4</span> 
    </div> 

Answer 1

Essayez ceci:

function calc(calcValue){ 
    var result = 0, count = 0; 
    var selector = "." + calcValue; 
    jQuery(selector).each(function(){ 
     var strValue = jQuery(this).text(); 
     result += parseInt(strValue); 
     count++; 
    }); 
    return result/count; 
} 

var composition = calc("composition"); 
var content = calc("content"); 
var technique = calc("technique"); 

alert("composition = " + composition); 
alert("content = " + content); 
alert("technique = " + technique); 

Answer 2

Sûr.

var somevalue = $('.composition').innerText();

Vous auriez probablement envie d'envelopper chaque score dans un div avec un identifiant unique, juste pour garder une trace de ce « score » sur votre.

alors quelque chose comme ...

$('.score').each(function(){ 
    // Loop through each element with a class of "score". 

var compositionScore = $(this).find('#composition').innerText(); 
........ 
// do some math or something. 
}); 

Im ne va pas écrire le code pour vous (même pas sûr à 100% que les mathématiques que vous voulez faire), mais il y a un bon point de départ.