Problem with CSS not applying in DIV

Question

People wanted to know why the id attribute of the div is not being recognized by the CSS, and the id name of the DIV is right in the CSS.

  function nome () {
    var tela = document.createElement('div').setAttribute('id', 'screen')
    document.body.appendChild(tela)
  }

  nome()

Answer 1

Your code should be:

  function nome () {
    var tela = document.createElement('div')
    tela.setAttribute('id', 'screen')
    document.body.appendChild(tela)
  }

  nome()

This is because the value of the screen variable does not have a correct type (expected Htmldivelement) so that it can be injected into the GIFT. In other words, the method setAttribute() returns "void". In fact, CSS is not applying to your DIV element because it doesn’t exist, because of the wrong instruction. When you do:

var tela = document.createElement("div").setAttribute("id","screen"); 

You actually create the DIV, but it’s still not in the DOM. And here you try to inject it into the DOM, but by the fact of the variable tela have a value "nothing" (Undefined), this DIV is never placed in your HTML document:

document.body.appendChild(tela); // essa linha não faz sentido