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

212
Views
translate from jquery to vanilla : $('.hack4-cms-anchor-section').each((i,sec) => observer.observe(sec) );

I've translate a code from jquery to vanilla.

Everything seems ok, but I have an error "Array.prototype.forEach callback must be a function" on the last line. Didn't manage to fix it.

What would be this jquery line, in vanilla:

// start intersection observer for each anchor section
   $('.hack4-cms-anchor-section').each((i,sec) => observer.observe(sec) );
   });

Here is the full code (the line in question, is the last one ) :

document.addEventListener("DOMContentLoaded", () => {
    const linkTextArr = []; 
    // for each filter button
    var navlinkbtn = document.querySelectorAll('.navlink_button');
    Array.prototype.forEach.call(navlinkbtn, function(link, index){
       // get its text content and reformat to a valid ID
       let linkText = link.textContent.replace(/\W/g,'_').toLowerCase(); 
       // set the reformatted linkText as the link href attribute
       link.setAttribute('href', '#'+linkText);
       // push reformatted linkText to array 
       linkTextArr.push(linkText);
       });
    // for each section
    var hack4cmsanchorsection = document.querySelectorAll('.hack4-cms-anchor-section');
    Array.prototype.forEach.call(hack4cmsanchorsection, function(index, link){
        // set id attribute to linkTextArray value sequentially
        // 1st sectn gets id: linkTextArr[0] etc..
        var section = document.getElementsByTagName('section');
        section.id = linkTextArr + [index]; 
        });
        // set up intrsctn obsrvr 
        // (navlnk btn s'allum qd sur sectn)
        // 2 observ whn th anchor sectns ar in viewport
        let observer = new IntersectionObserver((entries, observer) => { 
            // for each anchor section
            entries.forEach(entry => {
                // if it's in the viewport
                if(entry.isIntersecting){
                    // remov active class from current active link
                   document.querySelector('.navlink_button.hack4-active').classList.remove('hack4-active');
                    // add active class to current active link
                    document.querySelector(`.navlink_button[href='#${entry.target.id}']`).classList.add('hack4-active');
                   }
            });
        // set thrshld to 1 ensures the whole anchor section
        // is in viewport befor adding activ class to activ link
        // this part ', {threshold: 1}' is optional
    }, {threshold: 0});
// start intersection observer for each anchor section
hack4cmsanchorsection.forEach.call((i,sec) => observer.observe(sec) );
});
about 4 years ago · Juan Pablo Isaza
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!