Text Inserted in js Code?

JavaScript
1

I copied code from VS Code and pasted it below. I was surprised to note that it does not display here as it does in VS Code; so I made a ss, posted at the bottom.

Can someone, please, explain to me why the grayed out text : HTMLElement | null is appearing in my VS Code?

const deceasedFirstName = document.getElementById('deceasedFirstName')
const deceasedMiddleName = document.getElementById('deceasedMiddleName')
const deceasedLastName = document.getElementById('deceasedLastName')
const suffix = document.getElementById('suffix')
const clanID = document.getElementById('clanID')
const deathDate = document.getElementById('deathDate')
const deathYear = document.getElementById('deathYear')
const deathDateUnknown = document.getElementById('deathDateUnknown')
const deathCity = document.getElementById('deathCity')
const deathCounty = document.getElementById('deathCounty')
const deathState = document.getElementById('deathState')
const burialCity = document.getElementById('burialCity')
const burialCounty = document.getElementById('burialCounty')
const burialState = document.getElementById('burialState')
const burialCountry = document.getElementById('burialCountry')
const deathBurial = document.getElementById('deathBurial')
const deathCause = document.getElementById('deathCause')

const errorElement = document.getElementById('error')

form.addEventListener('submit', (e) => {
  let messages = []
  if (name.value === '' || name.value == null) {
    messages.push('Name is required')
  } 

  *********************************************************************************

  if (deathDate == 'false')
    else  UPDATE clan.deaths deathDate
      if(deathYear == 'false')
        else  UPDATE clan.deaths deathYear
          if(deathDateUnknown == 'false')
              messages.push('Must rovide Date, year or check "Unknown" box')
            else UPDATE clan.deaths deathDateUnknown      
      
  messages.push('Choose one of the options to indicated date of death')
      
    )

js question
js question1099×564 117 KB

2

That is telling you the type of the variable. getElementById() returns either an HTMLElement (if it is found) or null (if none is found). As you could see when you did a copy-paste, it doesn’t actually add that to the code itself but is providing you extra information in the IDE. (It is kinda nudging you to explicitly type your variables if you’re using TypeScript though])

1 Like
3

Thank you for the explanation. I had searched and found nothing to explain it. That informtion did not appear until after I tried to set a debugging point; so it was all new to me.

4

Ah. The added context that you were debugging explains a lot. The IDE will often show you a lot more of this sort of information while you are running a debug session.

1 Like