Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

159
Views
How can I manipulate HTML DOM with data from Database and Node (Mongoose)

Following the tutorial https://www.youtube.com/watch?v=u3rylF3y3og&ab_channel=TraversyMedia

I'm coding something that has a Star review feature. I want to change the width (through document.querySelector('').style.width = starPercentage) of elements to determine how many stars a review gave:

function getRatings() {
      for (let rating in ratings) {
        // Get percentage
        const starPercentage = (ratings[rating] / starsTotal) * 100;

        // Round to nearest 10
        const starPercentageRounded = `${Math.round(starPercentage / 10) * 10}%`;

        // Set width of stars-inner to percentage
        document.querySelector(`.${rating} .stars-inner`).style.width = starPercentageRounded;

        // Add number rating
        document.querySelector(`.${rating} .number-rating`).innerHTML = ratings[rating];
     }
}

But instead of the hard-coded values I'm getting the data from mongoose and express. What's the best way to manipulate the stars of each review?

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

The following article contains simple technique for filling star ratings in Javascript. https://webdesign.tutsplus.com/tutorials/a-simple-javascript-technique-for-filling-star-ratings--cms-29450

about 4 years ago · Juan Pablo Isaza Report

0

CSS

and add the correct css to the html class tag for example ( , ....)

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!