Uncaught typeEroor: Cannot read property of undefined

Question

I have this code with which I am trying to truncate the innerHTML of elements with an id of title:





    
    

    
    
    



    

        


            
            
                Hfe
                dvcd

            
        
        


            
            
                nbvn
                vbnv

            
        
        


            
            
                New post
                New

            
        
        


            
            
                Again
                mnmbmbm

            
        
        


            
            
                mn,
                m

            
        
        


            
            
                Reacting to the the funniest breakup texts
                sfd

            
        
        


            
            
                .m,m,
                nvb, ,bmvbcv
                    vcnbcm mbnmnbm,.mnm,,m.m,m,

            
        
        


            
            
                DVGGGGGGGGGGHDGGGGGGGGGHHHHHHGGGGGGGGGGGGGGGGGGGGGGGGGGG
                GGGGGG

It gives me this error:

Uncaught TypeError: Cannot read property 'length' of undefined

Aleksej · Accepted Answer

There are few things. First your title is returning the object, not the string. As it is an HTML element. In the loop titles[i].length is checking for length of current HTML element which is not possible, length checks for Array or string length. So you should use titles.length which is an array collection of HTML elements.

This also means for truncate function, you are sending an HTML element to the function, not the string. To pass the string, you should target b element inside the title, so you do not omit the HTML structure, and then get the textContent for further processing -> const text = titles[i].querySelector('b').textContent

So your function will look like this:

var titles = document.querySelectorAll("#title")

function truncate(input) {
   if (input.length > 10)
      return input.substring(0,10) + '...';
   else
      return input;
};


for(i=0; i < titles.length; i++){
    const text = titles[i].querySelector('b').textContent
    titles[i].querySelector('b').textContent =  truncate(text)
}

   

    
    

    
  
  



       

  


      
      
        Hfe
        dvcd

      
    



      
      
        nbvn
        vbnv

      
    



      
      
        New post
        New

      
    



      
      
        Again
        mnmbmbm

      
    



      
      
        mn,
        m

      
    



      
      
        Reacting to the the funniest breakup texts
        sfd

      
    



      
      
        .m,m,
        nvb, ,bmvbcv
vcnbcm mbnmnbm,.mnm,,m.m,m,

      
    



      
      
        DVGGGGGGGGGGHDGGGGGGGGGHHHHHHGGGGGGGGGGGGGGGGGGGGGGGGGGG
        GGGGGG

Uncaught typeEroor: Cannot read property of undefined

Answers (2)

Related Questions