Я застрял в маленькой ситуации. Я делаю плагин для своих школьных оценок, чтобы вычислить среднее значение. (Средние значения могут выглядеть неправильно, но так работают наши смазки.) На школьном сайте, который показывает оценки, используются те же названия классов. До сих пор я знаю, как рассчитать среднее значение 1 части.
Но есть ли способ вызвать 2 класса в querySelectorAll
. как это: [0], [1]?
<script
var matches = document.querySelectorAll(".course_eval_cell");
console.log(matches);
let up = 0;
let down = 0;
matches.forEach(function(fraction) {
var divided = fraction.innerHTML.split("/");
console.log(divided);
up += parseInt(divided[0]);
down += parseInt(divided[1]);
console.log(up);
console.log(down);
});
var result = (up / down ) * 100
console.log(result);
var result_fixed = result.toFixed(1) + "%";
console.log(result_fixed);
document.write('<p id="jstext">' + result_fixed + '</p>');
</script>
<div class="course_eval_row cf" style="width:770px;">
<div class="course_eval_cell hasGrade" smsctip="true">10/10</div>
<div class="course_eval_cell hasGrade ">88/100</div>
</div>
<div class="course_eval_row cf" style="width:770px;">
<div class="course_eval_cell hasGrade" smsctip="true">4/10</div>
<div class="course_eval_cell hasGrade ">34/50</div>
</div>
Я ожидаю 2 разных результата, среднее для первых классов и среднее для вторых классов. Спасибо за ваше время.
2 ответа
Ты можешь это сделать
<script>
var matches = document.querySelectorAll(".course_eval_row");
console.log(matches);
matches.forEach(function(fraction) {
var subNodes = fraction.querySelectorAll(".course_eval_cell");
let up = 0;
let down = 0;
subNodes.forEach(function(sub) {
var divided = sub.innerHTML.split("/");
console.log(divided);
up += parseInt(divided[0]);
down += parseInt(divided[1]);
console.log(up);
console.log(down);
});
var result = (up / down ) * 100
console.log(result);
var result_fixed = result.toFixed(1) + "%";
console.log(result_fixed);
document.write('<p id="jstext">' + result_fixed + '</p>');
});
</script>
Я думаю, что-то еще, как это то, что нужно:
const calculateAverage = (elem) => {
const arrGrade = Array.from(elem.querySelectorAll('.hasGrade')).map(({innerText: txt})=> {
const score = txt.split('/')[0];
const max = txt.split('/')[1];
return score/max;
});
return arrGrade.reduce((a,v) => a+=v)/arrGrade.length;
};
var matches = document.querySelectorAll(".course_eval_row");
matches.forEach(m => {
const div = document.createElement('div');
div.innerHTML = `Average - ${calculateAverage(m)}`;
m.appendChild(div);
});
.course_eval_row {
border: 1px solid red;
margin-top: 10px;
}
<div class="course_eval_row cf" style="width:770px;">
<div class="course_eval_cell hasGrade" smsctip="true">10/10</div>
<div class="course_eval_cell hasGrade ">88/100</div>
</div>
<div class="course_eval_row cf" style="width:770px;">
<div class="course_eval_cell hasGrade" smsctip="true">4/10</div>
<div class="course_eval_cell hasGrade ">34/50</div>
</div>
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.