DOM Elements Convert to Integer 并将它们转换为总时间量 - 小时/分钟 parseFloat

Question

所以我有一个网站记录的想法，我正在尝试获取所有的分钟数和小时数，然后创建总时间。

这是网站：

https://e013g.csb.app/

这是代码框：

https://codesandbox.io/s/boring-lalande-e013g?file=/src/index.js

如你所见，我得到了会议记录，并尝试将其转换为 parseFloat，然后尝试全部完成，但我遇到了困难。

const mins = document.querySelectorAll('.minutes');

// console.log(mins.value.innerText);

//var totalMinutes = 0;

mins.forEach(min => {

    const convertMins = parseFloat(min.innerHTML);
    // console.log(`convertMins: ${convertMins}`);

     const calculate = min + convertMins;
    //const calculate = convertMins + convertMins;
    console.log(calculate);

    // const minutes = min.innerHTML;
    // console.log(`Minutes: ${minutes}`);


    //console.log(min.innerText);
});

如果有人能提供指导，我将不胜感激。

谢谢，

戴夫。

P.S 我也在 Reddit 上问过：https://www.reddit.com/r/learnjavascript/comments/hlktfs/getting_all_minutes_and_hours_and_converting_them/

谢谢！

编辑

感谢 Pedro 的帮助，这里是完整的解决方案，如果有人想这样做的话：


//Minutes
const mins = document.querySelectorAll(".minutes");

var totalMinutes = 0;

mins.forEach(min => {
  const convertMins = parseFloat(min.innerHTML);
  totalMinutes = totalMinutes + convertMins;
});

console.log(totalMinutes);

//Hours
const hours = document.querySelectorAll(".hours");

var totalHours = 0;

hours.forEach(hour => {
  const convertHours = parseFloat(hour.innerHTML);
  console.log(`Hours: ${convertHours}`);

  const newMins = convertHours * 60;
  console.log(`new mins: ${newMins}`);

  //  totalHours = totalHours + convertHours;
  totalHours = totalHours + newMins;
});

console.log(`Total Hours ${totalHours}`);

//Then add the lot

const addTotal = totalMinutes + totalHours;
console.log(`This is the total time: ${addTotal}`);

//Then Convert The Lot

function time_convert(addTotal) {
  var hours = Math.floor(addTotal / 60);
  var minutes = addTotal % 60;
  return `${hours} hrs : ${minutes} Minutes`;
}

// console.log(time_convert(161));

const headingTotal = document.querySelector(".totalTime");
console.log(headingTotal);

headingTotal.innerText = time_convert(addTotal);

Answer 1

最短的方法是使用reduce:

const mins = document.querySelectorAll('.minutes');

var totalMinutes = mins.reduce((sum, min) => {
    const convertMins = parseFloat(min.innerHTML);
    return sum + convertMins;
}, 0);

console.log(totalMinutes);

但如果这对您来说很复杂，这里有一个使用 forEach:

的解决方案

const mins = document.querySelectorAll('.minutes');

var totalMinutes = 0;

mins.forEach(min => {
    const convertMins = parseFloat(min.innerHTML);
    totalMinutes = totalMinutes + convertMins;
});

console.log(totalMinutes);

DOM Elements Convert to Integer 并将它们转换为总时间量 - 小时/分钟 parseFloat

DOM Elements Convert to Integer and converting them into a total time amount - Hour / Minutes parseFloat

javascript

calculation