首页 > 解决方案 > DOM 元素转换为整数并将它们转换为总时间量 - 小时/分钟 parseFloat

问题描述

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

这是网站:

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);
});

如果有人可以提供指导,我将不胜感激。

谢谢,

戴夫。

PS我也在这里问过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);

标签: javascriptcalculation

解决方案


最短的方法是使用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);

推荐阅读