計數跨度標記的算術平均值

Question

我正在研究圖像上傳應用程序，用戶可以在圖像上分級。

當三個用戶對圖像給出分數時，html看起來像下面的代碼，我想要做的是從不同參數（構圖，內容，技術）生成算術平均值並將它們展示給用戶。

我想我需要做到以下幾點（加載頁面時）：

1. 從不同的跨度標籤獲取的值，並將其添加到不同的變量（成分，含量和技術）
2. 鴻溝變量的值與分數的職位數
3. 追加值頁面

我需要什麼是找出來的時候，頁面加載，以及如何幫助從不同的span標籤中獲取值。

在此先感謝！

<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

試試這個：

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

當然可以。

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

你可能想包裝每個分數與唯一ID的DIV，只是爲了保持跟蹤什麼「分數」你上。

然後像...

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

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

我不是要去寫出來給你的代碼（甚至不是100％肯定什麼數學你會想這樣做），但有一個很好的起點。