Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById()

Uncaught Typeerror Kan Inte Stalla In Egenskaperna For Null Vid Getelementbyid



När du kör kodblock i JavaScript kan det finnas situationer där olika typer av fel uppstår, vilket blir en flaskhals i implementeringen av kodfunktionerna. Dessa fel inkluderar att visa ett oinitierat värde, komma åt elementet innan det specificeras, etc. Ett sådant fel är ' Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById() ”, som kommer att diskuteras och lösas i den här artikeln.

Hur uppstår Uncaught TypeError: Kan inte ställa in egenskaper för null vid getElementById()?

den ' Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById() ” kan uppstå av följande skäl:

Exempel 1: Förekomst av Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById() på grund av föregående åtkomst av element

I det här exemplet kommer felet som uppstår på grund av åtkomst av det specifika elementet innan det specificeras att diskuteras:







< manus >

dokumentera. getElementById ( 'huvud' ) . innerHTML = 'JavaScript-innehåll' ;

manus >

< Centrum >< kropp >

< h2 id = 'huvud' > Linuxhint webbplats h2 >

kropp > Centrum >

Tillämpa följande steg, som anges i kodraderna ovan:



  • Inkludera först JavaScript-kodblocket i '

    I ovanstående utgång kan det ses att det angivna felet visas på grund av tidigare åtkomst till elementet.

    Lösning

    Det ovan påträffade felet i detta fall kan lösas genom att sekvensera koden så att elementet specificeras innan det nås.



    Följande exempel illustrerar det angivna konceptet:

    < Centrum >< kropp >

    < h2 id = 'huvud' > Linuxhint webbplats h2 >

    kropp > Centrum >

    < manus >

    dokumentera. getElementById ( 'huvud' ) . innerHTML = 'JavaScript-innehåll' ;

    manus >

    Ovanstående kod är identisk med den tidigare koden med ändringen i placeringen av kodblock. Det är sådant att '

    ”-elementet anges innan det nås i JavaScript-koden.

    Produktion

    Som sett är det påträffade felet löst och det uppdaterade innehållet via ' innerHTML ” egenskapen visas.

    Exempel 2: Förekomst av Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById() på grund av felaktig åtkomst av Id

    Det angivna felet kan också påträffas genom att man använder id:t felaktigt.

    Låt oss gå igenom nedanstående exempel:

    < tält-id = 'för' > Java tält >

    < skripttyp = 'text/javascript' >

    dokumentera. getElementById ( '#för' ) . innerText = 'Manus' ;

    manus >

    I kodavsnittet ovan:

    • Inkludera en ' ' element med det angivna ' id ” och textvärde.
    • I JS-delen av koden kommer du åt det inkluderade elementet i föregående steg med hjälp av ' getElementById() 'metoden.
    • den ' id ” formatet här är inte korrekt, med tanke på metoden för att komma åt det specifika elementet.
    • Här, ' innerText ”-egenskapen visar det angivna textvärdet.

    Produktion

    I denna utdata kan det verifieras att den tillämpade egenskapen inte påverkade elementet på grund av felaktigt id-format.

    Lösning

    Det nämnda felet i det här specifika scenariot kan lösas genom att ange id korrekt när du kommer åt elementet:

    < tält-id = 'för' > Java tält >

    < skripttyp = 'text/javascript' >

    dokumentera. getElementById ( 'för' ) . innerText = 'Manus' ;

    manus >

    Implementera stegen nedan, som anges i ovanstående kod:

    • Inkludera ' ' element som har den givna ' id ”.
    • I JavaScript-kodavsnittet, gå till elementet i föregående steg genom att ange elementets ' id ' korrekt via ' getElementById() 'metoden.
    • Till sist, tillämpa ' innerText ” egenskapen och visa det angivna textinnehållet, som kommer att uppdateras i detta fall.

    Produktion

    I ovanstående utdata kan det visualiseras att det uppdaterade textinnehållet visas.

    Slutsats

    den ' Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById() ” i JavaScript kan lösas genom att ange elementet innan du kommer åt det eller genom att ange id i rätt format. Efter att ha gjort det kan motsvarande funktioner exekveras i båda fallen. Den här bloggen vägledde hur man löser Uncaught TypeError: Kan inte ställa in egenskaperna för null vid getElementById() i JavaScript.