diff --git a/README.md b/README.md index 42684231e..db071814d 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@ 1. Replace `` with your Github username in the link - - [DEMO LINK](https://.github.io/js_get_data_DOM/) + - [DEMO LINK](https://A1daros.github.io/js_get_data_DOM/) 2. Follow [this instructions](https://mate-academy.github.io/layout_task-guideline/) - - There are no tests for this task so use `npm run lint` command instead of `npm test` + - There are no tests for this task so use `npm run lint` command instead of `npm test` ### Task: TOP 9 LARGEST COUNTRIES BY POPULATION @@ -9,6 +9,7 @@ Hello! In this task, you need to parse data from the list, and based on it get t You no need to change styles or HTML layout in this task. Change only `main.js` file. Steps to do this challenge: + 1. Get all text data from `span` with class `population` 2. Make sure that the given string can be converted to a number and convert it to number. 3. Calculate average and total value-based to parsed numbers. diff --git a/src/scripts/main.js b/src/scripts/main.js index c6e3f8784..4f7e456ba 100644 --- a/src/scripts/main.js +++ b/src/scripts/main.js @@ -1,3 +1,29 @@ 'use strict'; -// write your code here +const spanData = document.querySelectorAll('.population'); +const convertedSpanData = Array.from(spanData).map((span) => { + const raw = span.textContent; + const cleaned = raw.trim().replace(/[,\s]/g, ''); + const numValue = Number(cleaned); + + if (Number.isNaN(numValue)) { + return 0; + } + + const population = numValue; + + return population; +}); + +const totalPopulation = convertedSpanData.reduce((acc, population) => { + return acc + population; +}, 0); +const averagePopulation = Math.round( + totalPopulation / convertedSpanData.length, +); + +const totalPopulationElement = document.querySelector('.total-population'); +const averagePopulationElement = document.querySelector('.average-population'); + +totalPopulationElement.textContent = totalPopulation.toLocaleString(); +averagePopulationElement.textContent = averagePopulation.toLocaleString();