简体   繁体   中英

While navigating HTML Elements with forEach, the getElementsByClassName function does not work on these elements

Let me try to explain, but you will understand better when you see the codes. I get my div elements with the getElementsByClassName function and then convert it to an array with the Array.from() function. While navigating this array with the forEach function, I am sending each element to a function. In this function, the item parameter represents my element. I can display this element with console.log(item) and even list its child elements with item.children . However, when I select this div with document.getElementById() using Inspect(F12) and then run the getElementsByClassName function only on this div, I do not get an error, but in the item.getElementsByClassName function I wrote in the html page, I get the error 'Uncaught TypeError: item.getELementsByClassName is not a function' .

I leave the code I wrote below. Error in registerClickOrdering function.

function registerClickHandler() {
          $('.remove_question_div').click(function() {
            var removedId = parseInt($(this).parent().attr('id').split('-').slice(-1))
            $(this).parent().remove();
            
            var questions = Array.from(document.getElementsByClassName('questions')).slice(removedId-1)
            console.log(questions)
            questions.forEach((item, index) => {registerClickOrdering(item, index)})
          });
        }

const registerClickOrdering = (item, index) => {
      console.log(item)
      item.id=`question_div-${index+2}`
      var questionCounterLbl = item.getELementsByClassName('question-counter')[0]
      questionCounterLbl.textContent = `${index+1}. Soru`
      var questionTitle = item.getELementsByClassName('question-title')[0]
      questionTitle.name = `question-${index+1}`
      questionTitle.id = `id_question-${index+1}`
      var answerInputs = Array.from(item.getELementsByClassName('answers-input'))
      answerInputs.forEach((item) => {
        item.name = `answer-${index+1}`
      })

    }

You're doing everything right except for one, tiny thing that a linter could help you with in the future...

Change getELementsByClassName to getElementsByClassName

Happens to everyone at some point.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM