Em JavaScript, podemos ocultar os elementos usando o estilo.display ou usando o estilo.visibilidade . O visibilidade propriedade em JavaScript também é usada para ocultar um elemento. A diferença entre o estilo.display e estilo.visibilidade é ao usar visibilidade: oculto, a tag não está visível, mas o espaço é alocado. Usando Mostrar nenhum, a tag também não está visível, mas não há espaço alocado na página.
Em HTML, podemos usar o escondido atributo para ocultar o elemento especificado. Quando o escondido atributo em HTML é definido como verdadeiro, o elemento está oculto ou quando o valor é falso, o elemento está visível.
tupla java
Sintaxe
A sintaxe geral para ocultar um elemento usando estilo.oculto e estilo.visibilidade é dado da seguinte forma.
Usando estilo.oculto
document.getElementById('element').style.display = 'none';
Usando estilo.visibilidade
document.getElementById('element').style.visibility = 'none';
Agora, vamos ver alguns exemplos para entender a ocultação de elementos em javascript .
c++ int para string
Exemplo 1
Neste exemplo, veremos como remover elementos usando JavaScript estilo.display propriedade. Aqui, há um divisão elemento e um elemento de parágrafo que fica oculto ao clicar no determinado Botão HTML . Temos que clicar no 'Clique em mim!' botão para ver o efeito.
style.display <h2> Using both style.visibility and style.display properties </h2> This is the div element. <p> This is a paragraph element. </p> <h3 id="heading"> This is the heading after the paragraph element. </h3> Click me! function fun() { document.getElementById('div').style.visibility = 'hidden'; document.getElementById('heading').style.display = 'none'; }Teste agora
Saída
Na saída, podemos ver que o divisão elemento (no qual aplicamos estilo.visibilidade propriedade) está ocultando, mas ainda alocando o espaço. Mas o título (ao qual aplicamos estilo.display propriedade) está se escondendo e não alocando nenhum espaço.
Após clicar no botão, o resultado será -