Ocultando un objeto del DOM

Bueno, muchos han de ver visto algo parecido en algun lado. Dando click en un boton (div) se oulta un elemento (por lo general otro div o imagen) Pues aqui pongo como hacerlo:

mostrar_elemento

Es el archivo donde viene la practica y aqui explicare el codigo.

Todos deberian saber hasta el <title>, espero.

Porcedemos a llamar a la ultima versión de JQuery.
Ahora ponemos el codigo de JQuey:

$(document).ready(function(){

$('#elemento').hide();

$("div:eq(1)").click(function(){

$('#elemento').show();

});

});

Empezando diciendo que cuando el documento este listo ejecute lo siguiente.

(voy por lineas)

ahora, seleccionamos el div con id elemento y lo escondemos, osea, no va a aparecer.

despues seleccionamos el segundo div que este (se empieza por 0 como todo lenguaje de programacion)

le decimos que cuando se haga click en el, se muestren todos lso elementos con id (obviamente, solo puede haber 1 objeto con el mismo id) elemento. y si lo bajan y lo prueban, veran que no aparecera el texto:

<div id="elemento">Este elemento esta oculto por defecto y lo msotraremos pulsando otro div que efectuara la funcion de un boton</div>

y con eso, ocultamos y mostramos un elemento del DOM (Documento Object Model) o del documento.

Ahora pueden modificar de mil formas este simple script, como que al dar click al texto que apareció, se oculte. Les mostrare como:

$(document).ready(function(){

    $('#elemento').hide();

$("div:eq(1)").click(function(){

    $('#elemento').show();

}); 

});

El de arriba es el original

$(document).ready(function(){

    $('#elemento').hide();

$("div:eq(1)").click(function(){

    $('#elemento').show();

}); 

$("#elemento").click(function(){

    $(this).hide();

});

});

Simplemente le agregamos, antes de cerrar el $(document).ready[...],

$("#elemento").click(function(){

    $(this).hide();

});

No es nada que no este arriba, simplemente explicar que, $(this) lo ponemos por que, arriba ya esta seleccionado el elemento con el id elemento. y si le agregan eso, verán que, al dar click en el botón, sale el texto y al dar click en el texto, se oculta el texto.

Es todo, después traeré mas script útiles para decorar paginas web.

Autor: Yo mismo XD