How to make a div disappear and appear with JScript

Question

How to make a div disappear and appear with JScript

Navigation

#1 by (1 votes)

1

I know you have a lot of topics talking about "how to make a div appear and disappear with JScript", most of them teach to do:

document.getElementById('divaqui').style.visibility = 'hidden';
document.getElementById('divaqui').style.visibility = 'visible';

But I need to do it a little differently
I've deleted all images (and div's within this div conteudo ) from a div through this function

function limpaConteudo()
{
    $(conteudo).empty() 
}

Now I need to make one of the div's appear again inside the conteudo that was cleaned.
I do not know if I was clear. Home Can you help me? Obg

function limpaConteudo()
        {
          $(conteudo).empty() 
          document.getElementById('conteudo').style.background='#fff';
        }

#conteudo{
      width:250px;
      height:250px;
      float:left;
      background-color:#ff1;  
      display: initial;
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><html><body><divid="conteudo" class="conteudo"> 
				<img src="https://png.icons8.com/view-as-different-user/ios7/50"></div><divid="lixoLimpaConteudo">
					<img src="https://png.icons8.com/view-as-different-user/ios7/50"onclick="limpaConteudo()" alt="Limpar conteúdo">
				</div>
  </body>
</html>

javascript html

asked by anonymous 18.09.2017 / 19:38

1 answer

Oracle - Error connecting to ADOConnection Delphi 10.1 (Berlin) How to transform pointer into array

score 1 · Accepted Answer

In case you already have the image in the div id="garbageLimpaConteudo" then I am relying on it to "restore" the content, I left the commented code for a better understanding.

function alteraConteudo(imagem)
{
  var novaImagem = "<img src='" + imagem.attr("src") + "' />"; //Crio uma nova imagem com mesmo src da clicada.
  if ($("#conteudo").is(':empty')){ //Se estiver vazia insiro a imagem clicada.
     $("#conteudo").append(novaImagem); //Atribui a nova imagem a div conteúdo.
     $("#conteudo").css("background-color", "#ff1"); //coloco a cor incial da div
  }else{ //Se possuir conteúdo limpo.
    $("#conteudo").empty()  //Limpa a div conteudo
     document.getElementById('conteudo').style.background='#fff'; //remove a cor da div
  }
}

#conteudo{
      width:250px;
      height:250px;
      float:left;
      background-color:#ff1;  
      display: initial;
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><html><body><divid="conteudo" class="conteudo"> 
				<img src="https://png.icons8.com/view-as-different-user/ios7/50"/></div><divid="lixoLimpaConteudo">
					<img src="https://png.icons8.com/view-as-different-user/ios7/50"onclick="alteraConteudo($(this))" alt="Limpar conteúdo" />
				</div>
  </body>
</html>