🕷️ Crawler Inspector

URL Lookup

Direct Parameter Lookup

Raw Queries and Responses

1. Shard Calculation

Query:

Response:

Calculated Shard: 32 (from laksa175)

2. Crawled Status Check

Query:

curl -X POST \
  'http://laksa032.int.ahrefs:8124/' \
  -H 'Content-Type: text/plain' \
  -H 'X-ClickHouse-Database: crawler3' \
  -H 'Authorization: Basic YXBpOg==' \
  -d 'SELECT getAhrefsURLFromUnparsed(src_unparsed) AS found_url, ifNull(toUnixTimestamp(download_stamp), 0) AS crawl_time, ifNull(toUnixTimestamp(props_url_first_seen), 0) AS first_indexed_time, download_http_code AS http_code, src_unparsed AS src_unparsed, src_root_hash AS src_root_hash, history_drop_reason AS history_drop_reason, meta_title AS meta_title, meta_descriptions AS meta_descriptions, attrs_boilerpipe_text AS attrs_boilerpipe_text, attrs_markdown AS attrs_markdown, attrs_readable_markdown AS attrs_readable_markdown, meta_canonical AS meta_canonical, ml_categories_json AS ml_categories_json, ml_types_json AS ml_types_json, ml_intent_types_json AS ml_intent_types_json, meta_language AS meta_language, attrs_author AS attrs_author, ifNull(toUnixTimestamp(attrs_publish_time), 0) AS attrs_publish_time, ifNull(toUnixTimestamp(attrs_original_publish_time), 0) AS attrs_original_publish_time, ifNull(attrs_is_republished, 0) AS attrs_is_republished, ifNull(attrs_nr_words, 0) AS attrs_nr_words, ifNull(attrs_boilerpipe_nr_words, 0) AS attrs_boilerpipe_nr_words, ifNull(body_ext_links_number, 0) AS body_ext_links_number, ifNull(body_int_links_number, 0) AS body_int_links_number, ifNull(meta_nofollow, 0) AS meta_nofollow, ifNull(meta_noarchive, 0) AS meta_noarchive, ifNull(props_was_rendered, 0) AS props_was_rendered, ifNull(src_redirect, \'\') AS src_redirect, ifNull(download_time_msec, 0) AS download_time_msec, ifNull(download_ttfb_msec, 0) AS download_ttfb_msec, ifNull(download_size, 0) AS download_size FROM crawler3.page_info_local FINAL PREWHERE (src_root_hash, src_unparsed) IN ((getAhrefsRootHashFromUnparsed(getAhrefsUnparsedNoserviceFromURL(\'https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/\')), getAhrefsUnparsedNoserviceFromURL(\'https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/\'))) FORMAT JSONEachRow'

Response:

{"found_url":"https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/","crawl_time":1776096004,"first_indexed_time":1771552165,"http_code":200,"src_unparsed":"com,miguelmanchego!\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/ s443","src_root_hash":"7995146238140876632","history_drop_reason":null,"meta_title":"Jquery: ocultar mostrar varios elementos","meta_descriptions":["En este tutorial veremos como mostrar u ocultar cualquier cantidad de elementos usando jquery","En este tutorial veremos como mostrar u ocultar cualquier cantidad de elementos usando jquery"],"attrs_boilerpipe_text":"Hace un tiempo publiqué un tutorial explicando como como\nocultar o mostrar un elemento\n, pero también es posible hacerlo con múltiples elementos sin tener que agregar un script por cada elemento, para eso hay que usar id que identifiquen a los elementos y clases para conocer su estado.\nSimplemente con fines didácticos he planteado el ejemplo usando el evento onclick y usando clases sin embargo es posible simplificarlo mucho más asignando el click desde jquery y no usando clases sino atributos.\nEl HTML de los elementos\n[cc lang=»html»]\n[\/cc]\nEs posible usar cuantos elementos se requieran y puede usarse cualquier tipo de elemento no exclusivamente div, basta que les pongamos un id y la clase que me indica su estado (visible\/invisible)\nPara el menu que muestra u oculta los elementos, sería el siguiente script:\n[cc lang=»html»]\nOculta\/Muestra\nOculta\/Muestra\nOculta\/Muestra\nOculta\/Muestra\nOculta\/Muestra\nOculta\/Muestra\n[\/cc]\nLa función para ocultar\/mostrar usando jquery\nComo vemos el menu invoca a una función llamada «oculta» y le envía como parámetro el id del elemento que queremos ocultar o mostrar según sea el caso, una vez que capturamos ese elemento pasamos a verificar si esta o no visible para finalmente aplicarle una pequeña animación según sea el caso.\n[cc lang=»javascript»]\nfunction oculta(elemento) {\n\/\/\/\/\/ capturamos el elemento\nitem=$(«#»+elemento);\n\/\/\/\/\/ verificamos su estado\nif($(item).hasClass(‘visible’)) {\n$(item).removeClass(‘visible’);\n\/\/\/\/ cambiamos su estado\n$(item).addClass(‘invisible’);\n\/\/\/\/ animamos\n$(item).slideUp(‘fast’);\n} else {\n$(item).removeClass(‘invisible’);\n$(item).addClass(‘visible’);\n$(item).slideDown(‘fast’);\n}\n}\n[\/cc]\nDemo","attrs_markdown":"[Ir al contenido](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/#content)\n\n[![](https:\/\/miguelmanchego.com\/wp-content\/uploads\/2024\/11\/logo-maketa.png)](https:\/\/miguelmanchego.com\/)\n\n- [Inicio](https:\/\/miguelmanchego.com\/)\n- [Blog](https:\/\/miguelmanchego.com\/blog\/)\n  - [CSS](https:\/\/miguelmanchego.com\/category\/css\/)\n  - [PHP](https:\/\/miguelmanchego.com\/category\/php\/)\n  - [javascript](https:\/\/miguelmanchego.com\/category\/javascript\/)\n  - [WordPress](https:\/\/miguelmanchego.com\/category\/wordpress\/)\n- [Acerca de mi](https:\/\/miguelmanchego.com\/about\/)\n- [Contáctame](https:\/\/miguelmanchego.com\/contactanos\/)\n\n- [Inicio](https:\/\/miguelmanchego.com\/)\n- [Blog](https:\/\/miguelmanchego.com\/blog\/)\n  - [CSS](https:\/\/miguelmanchego.com\/category\/css\/)\n  - [PHP](https:\/\/miguelmanchego.com\/category\/php\/)\n  - [javascript](https:\/\/miguelmanchego.com\/category\/javascript\/)\n  - [WordPress](https:\/\/miguelmanchego.com\/category\/wordpress\/)\n- [Acerca de mi](https:\/\/miguelmanchego.com\/about\/)\n- [Contáctame](https:\/\/miguelmanchego.com\/contactanos\/)\n\n[AJAX](https:\/\/miguelmanchego.com\/tag\/ajax\/), [jquery](https:\/\/miguelmanchego.com\/tag\/jquery\/)\n\n# Jquery: ocultar mostrar varios elementos\n\nHace un tiempo publiqué un tutorial explicando como como [ocultar o mostrar un elemento](https:\/\/www.miguelmanchego.com\/2009\/ajax-ocultar-mostrar-secciones-de-nuestro-sitio\/), pero también es posible hacerlo con múltiples elementos sin tener que agregar un script por cada elemento, para eso hay que usar id que identifiquen a los elementos y clases para conocer su estado.  \n   \n  \n Simplemente con fines didácticos he planteado el ejemplo usando el evento onclick y usando clases sin embargo es posible simplificarlo mucho más asignando el click desde jquery y no usando clases sino atributos.\n\n### El HTML de los elementos\n\\[cc lang=»html»\\]\n\n\\[\/cc\\]  \n Es posible usar cuantos elementos se requieran y puede usarse cualquier tipo de elemento no exclusivamente div, basta que les pongamos un id y la clase que me indica su estado (visible\/invisible)\n\nPara el menu que muestra u oculta los elementos, sería el siguiente script:  \n \\[cc lang=»html»\\]\n\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n\n\\[\/cc\\]\n\n### La función para ocultar\/mostrar usando jquery\nComo vemos el menu invoca a una función llamada «oculta» y le envía como parámetro el id del elemento que queremos ocultar o mostrar según sea el caso, una vez que capturamos ese elemento pasamos a verificar si esta o no visible para finalmente aplicarle una pequeña animación según sea el caso.  \n \\[cc lang=»javascript»\\]  \n function oculta(elemento) {  \n \/\/\/\/\/ capturamos el elemento  \n item=\\$(«\\#»+elemento);  \n \/\/\/\/\/ verificamos su estado  \n if(\\$(item).hasClass(‘visible’)) {  \n \\$(item).removeClass(‘visible’);  \n \/\/\/\/ cambiamos su estado  \n \\$(item).addClass(‘invisible’);  \n \/\/\/\/ animamos  \n \\$(item).slideUp(‘fast’);  \n } else {  \n \\$(item).removeClass(‘invisible’);  \n \\$(item).addClass(‘visible’);  \n \\$(item).slideDown(‘fast’);  \n }  \n }  \n \\[\/cc\\]\n\n[Demo](https:\/\/www.miguelmanchego.com\/wp-content\/demos\/jquery\/ocultar-elementos2)\n\n## Categorías\n- [WordPress](https:\/\/miguelmanchego.com\/category\/wordpress\/)\n- [CSS](https:\/\/miguelmanchego.com\/category\/css\/)\n- [html](https:\/\/miguelmanchego.com\/category\/html\/)\n- [javascript](https:\/\/miguelmanchego.com\/category\/javascript\/)\n- [Desarrollo web](https:\/\/miguelmanchego.com\/category\/desarrollo-web\/)\n- [Posicionamiento](https:\/\/miguelmanchego.com\/category\/posicionamiento\/)\n\n- [WordPress](https:\/\/miguelmanchego.com\/category\/wordpress\/)\n- [CSS](https:\/\/miguelmanchego.com\/category\/css\/)\n- [html](https:\/\/miguelmanchego.com\/category\/html\/)\n- [javascript](https:\/\/miguelmanchego.com\/category\/javascript\/)\n- [Desarrollo web](https:\/\/miguelmanchego.com\/category\/desarrollo-web\/)\n- [Posicionamiento](https:\/\/miguelmanchego.com\/category\/posicionamiento\/)\n## Últimos Posts\n[![](https:\/\/miguelmanchego.com\/wp-content\/uploads\/2024\/12\/style-table-cells-css-300x225.webp)](https:\/\/miguelmanchego.com\/2024\/12\/04\/dar-estilos-a-una-tabla-y-efecto-zebra\/)\n\n#### [Dar estilos a una tabla y efecto zebra](https:\/\/miguelmanchego.com\/2024\/12\/04\/dar-estilos-a-una-tabla-y-efecto-zebra\/)\n\n[![](https:\/\/miguelmanchego.com\/wp-content\/uploads\/2024\/12\/boton-whatsapp-flotante-300x225.webp)](https:\/\/miguelmanchego.com\/2024\/12\/04\/como-crear-un-boton-flotante-de-whatsapp-para-tu-sitio-web\/)\n\n#### [Cómo Crear un Botón Flotante de WhatsApp para tu Sitio Web](https:\/\/miguelmanchego.com\/2024\/12\/04\/como-crear-un-boton-flotante-de-whatsapp-para-tu-sitio-web\/)\n\n[![](https:\/\/miguelmanchego.com\/wp-content\/uploads\/2024\/12\/loading-spinners-pure-css-300x225.webp)](https:\/\/miguelmanchego.com\/2024\/12\/04\/como-crear-4-spinners-loaders-con-css-puro\/)\n\n#### [Cómo Crear Spinners\/Loaders con CSS Puro](https:\/\/miguelmanchego.com\/2024\/12\/04\/como-crear-4-spinners-loaders-con-css-puro\/)\n## ¿Necesitas ayuda?\nSi requieres ayuda para desarrollar tu sitio web, crear plugins para Wordpress o módulos personalizados para Elementor a precio razonable. [Contáctame](https:\/\/miguelmanchego.com\/contactanos\/)\n\nMiguel Manchego, Todos los derechos reservados 2024","attrs_readable_markdown":"Hace un tiempo publiqué un tutorial explicando como como [ocultar o mostrar un elemento](https:\/\/www.miguelmanchego.com\/2009\/ajax-ocultar-mostrar-secciones-de-nuestro-sitio\/), pero también es posible hacerlo con múltiples elementos sin tener que agregar un script por cada elemento, para eso hay que usar id que identifiquen a los elementos y clases para conocer su estado.\n\nSimplemente con fines didácticos he planteado el ejemplo usando el evento onclick y usando clases sin embargo es posible simplificarlo mucho más asignando el click desde jquery y no usando clases sino atributos.\n### El HTML de los elementos\n\\[cc lang=»html»\\]\n\n\\[\/cc\\]  \n Es posible usar cuantos elementos se requieran y puede usarse cualquier tipo de elemento no exclusivamente div, basta que les pongamos un id y la clase que me indica su estado (visible\/invisible)\n\nPara el menu que muestra u oculta los elementos, sería el siguiente script:  \n \\[cc lang=»html»\\]\n\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n- [Oculta\/Muestra](https:\/\/miguelmanchego.com\/2010\/08\/24\/jquery-ocultar-mostrar-varios-elementos\/)\n\n\\[\/cc\\]\n\n### La función para ocultar\/mostrar usando jquery\nComo vemos el menu invoca a una función llamada «oculta» y le envía como parámetro el id del elemento que queremos ocultar o mostrar según sea el caso, una vez que capturamos ese elemento pasamos a verificar si esta o no visible para finalmente aplicarle una pequeña animación según sea el caso.  \n \\[cc lang=»javascript»\\]  \n function oculta(elemento) {  \n \/\/\/\/\/ capturamos el elemento  \n item=\\$(«\\#»+elemento);  \n \/\/\/\/\/ verificamos su estado  \n if(\\$(item).hasClass(‘visible’)) {  \n \\$(item).removeClass(‘visible’);  \n \/\/\/\/ cambiamos su estado  \n \\$(item).addClass(‘invisible’);  \n \/\/\/\/ animamos  \n \\$(item).slideUp(‘fast’);  \n } else {  \n \\$(item).removeClass(‘invisible’);  \n \\$(item).addClass(‘visible’);  \n \\$(item).slideDown(‘fast’);  \n }  \n }  \n \\[\/cc\\]\n\n[Demo](https:\/\/www.miguelmanchego.com\/wp-content\/demos\/jquery\/ocultar-elementos2)","meta_canonical":null,"ml_categories_json":"","ml_types_json":"","ml_intent_types_json":"","meta_language":"es","attrs_author":null,"attrs_publish_time":1282650694,"attrs_original_publish_time":1282650694,"attrs_is_republished":0,"attrs_nr_words":"356","attrs_boilerpipe_nr_words":"246","body_ext_links_number":0,"body_int_links_number":23,"meta_nofollow":0,"meta_noarchive":0,"props_was_rendered":0,"src_redirect":"","download_time_msec":903,"download_ttfb_msec":902,"download_size":14702}

3. Robots.txt Check

Query:

Response:

4. Spam/Ban Check

Query:

Response:

5. Seen Status Check

ℹ️ Skipped - page is already crawled

📄

INDEXABLE

✅

CRAWLED

9 days ago

🤖

ROBOTS ALLOWED

Page Info Filters

Filter	Status	Condition	Details
HTTP status	PASS	`download_http_code = 200`	HTTP 200
Age cutoff	PASS	`download_stamp > now() - 6 MONTH`	0.3 months ago
History drop	PASS	`isNull(history_drop_reason)`	No drop reason
Spam/ban	PASS	`fh_dont_index != 1 AND ml_spam_score = 0`	ml_spam_score=0
Canonical	PASS	`meta_canonical IS NULL OR = '' OR = src_unparsed`	Not set

Page Details

Property	Value
URL	https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/
Last Crawled	2026-04-13 16:00:04 (9 days ago)
First Indexed	2026-02-20 01:49:25 (2 months ago)
HTTP Status Code	200
Content
Meta Title	Jquery: ocultar mostrar varios elementos
Meta Description	En este tutorial veremos como mostrar u ocultar cualquier cantidad de elementos usando jquery, En este tutorial veremos como mostrar u ocultar cualquier cantidad de elementos usando jquery
Meta Canonical	null
Boilerpipe Text	Hace un tiempo publiqué un tutorial explicando como como ocultar o mostrar un elemento , pero también es posible hacerlo con múltiples elementos sin tener que agregar un script por cada elemento, para eso hay que usar id que identifiquen a los elementos y clases para conocer su estado. Simplemente con fines didácticos he planteado el ejemplo usando el evento onclick y usando clases sin embargo es posible simplificarlo mucho más asignando el click desde jquery y no usando clases sino atributos. El HTML de los elementos [cc lang=»html»] [/cc] Es posible usar cuantos elementos se requieran y puede usarse cualquier tipo de elemento no exclusivamente div, basta que les pongamos un id y la clase que me indica su estado (visible/invisible) Para el menu que muestra u oculta los elementos, sería el siguiente script: [cc lang=»html»] Oculta/Muestra Oculta/Muestra Oculta/Muestra Oculta/Muestra Oculta/Muestra Oculta/Muestra [/cc] La función para ocultar/mostrar usando jquery Como vemos el menu invoca a una función llamada «oculta» y le envía como parámetro el id del elemento que queremos ocultar o mostrar según sea el caso, una vez que capturamos ese elemento pasamos a verificar si esta o no visible para finalmente aplicarle una pequeña animación según sea el caso. [cc lang=»javascript»] function oculta(elemento) { ///// capturamos el elemento item=$(«#»+elemento); ///// verificamos su estado if($(item).hasClass(‘visible’)) { $(item).removeClass(‘visible’); //// cambiamos su estado $(item).addClass(‘invisible’); //// animamos $(item).slideUp(‘fast’); } else { $(item).removeClass(‘invisible’); $(item).addClass(‘visible’); $(item).slideDown(‘fast’); } } [/cc] Demo
Markdown	[Ir al contenido](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/#content) [![](https://miguelmanchego.com/wp-content/uploads/2024/11/logo-maketa.png)](https://miguelmanchego.com/) - [Inicio](https://miguelmanchego.com/) - [Blog](https://miguelmanchego.com/blog/) - [CSS](https://miguelmanchego.com/category/css/) - [PHP](https://miguelmanchego.com/category/php/) - [javascript](https://miguelmanchego.com/category/javascript/) - [WordPress](https://miguelmanchego.com/category/wordpress/) - [Acerca de mi](https://miguelmanchego.com/about/) - [Contáctame](https://miguelmanchego.com/contactanos/) - [Inicio](https://miguelmanchego.com/) - [Blog](https://miguelmanchego.com/blog/) - [CSS](https://miguelmanchego.com/category/css/) - [PHP](https://miguelmanchego.com/category/php/) - [javascript](https://miguelmanchego.com/category/javascript/) - [WordPress](https://miguelmanchego.com/category/wordpress/) - [Acerca de mi](https://miguelmanchego.com/about/) - [Contáctame](https://miguelmanchego.com/contactanos/) [AJAX](https://miguelmanchego.com/tag/ajax/), [jquery](https://miguelmanchego.com/tag/jquery/) # Jquery: ocultar mostrar varios elementos Hace un tiempo publiqué un tutorial explicando como como [ocultar o mostrar un elemento](https://www.miguelmanchego.com/2009/ajax-ocultar-mostrar-secciones-de-nuestro-sitio/), pero también es posible hacerlo con múltiples elementos sin tener que agregar un script por cada elemento, para eso hay que usar id que identifiquen a los elementos y clases para conocer su estado. Simplemente con fines didácticos he planteado el ejemplo usando el evento onclick y usando clases sin embargo es posible simplificarlo mucho más asignando el click desde jquery y no usando clases sino atributos. ### El HTML de los elementos \[cc lang=»html»\] \[/cc\] Es posible usar cuantos elementos se requieran y puede usarse cualquier tipo de elemento no exclusivamente div, basta que les pongamos un id y la clase que me indica su estado (visible/invisible) Para el menu que muestra u oculta los elementos, sería el siguiente script: \[cc lang=»html»\] - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) \[/cc\] ### La función para ocultar/mostrar usando jquery Como vemos el menu invoca a una función llamada «oculta» y le envía como parámetro el id del elemento que queremos ocultar o mostrar según sea el caso, una vez que capturamos ese elemento pasamos a verificar si esta o no visible para finalmente aplicarle una pequeña animación según sea el caso. \[cc lang=»javascript»\] function oculta(elemento) { ///// capturamos el elemento item=\$(«\#»+elemento); ///// verificamos su estado if(\$(item).hasClass(‘visible’)) { \$(item).removeClass(‘visible’); //// cambiamos su estado \$(item).addClass(‘invisible’); //// animamos \$(item).slideUp(‘fast’); } else { \$(item).removeClass(‘invisible’); \$(item).addClass(‘visible’); \$(item).slideDown(‘fast’); } } \[/cc\] [Demo](https://www.miguelmanchego.com/wp-content/demos/jquery/ocultar-elementos2) ## Categorías - [WordPress](https://miguelmanchego.com/category/wordpress/) - [CSS](https://miguelmanchego.com/category/css/) - [html](https://miguelmanchego.com/category/html/) - [javascript](https://miguelmanchego.com/category/javascript/) - [Desarrollo web](https://miguelmanchego.com/category/desarrollo-web/) - [Posicionamiento](https://miguelmanchego.com/category/posicionamiento/) - [WordPress](https://miguelmanchego.com/category/wordpress/) - [CSS](https://miguelmanchego.com/category/css/) - [html](https://miguelmanchego.com/category/html/) - [javascript](https://miguelmanchego.com/category/javascript/) - [Desarrollo web](https://miguelmanchego.com/category/desarrollo-web/) - [Posicionamiento](https://miguelmanchego.com/category/posicionamiento/) ## Últimos Posts [![](https://miguelmanchego.com/wp-content/uploads/2024/12/style-table-cells-css-300x225.webp)](https://miguelmanchego.com/2024/12/04/dar-estilos-a-una-tabla-y-efecto-zebra/) #### [Dar estilos a una tabla y efecto zebra](https://miguelmanchego.com/2024/12/04/dar-estilos-a-una-tabla-y-efecto-zebra/) [![](https://miguelmanchego.com/wp-content/uploads/2024/12/boton-whatsapp-flotante-300x225.webp)](https://miguelmanchego.com/2024/12/04/como-crear-un-boton-flotante-de-whatsapp-para-tu-sitio-web/) #### [Cómo Crear un Botón Flotante de WhatsApp para tu Sitio Web](https://miguelmanchego.com/2024/12/04/como-crear-un-boton-flotante-de-whatsapp-para-tu-sitio-web/) [![](https://miguelmanchego.com/wp-content/uploads/2024/12/loading-spinners-pure-css-300x225.webp)](https://miguelmanchego.com/2024/12/04/como-crear-4-spinners-loaders-con-css-puro/) #### [Cómo Crear Spinners/Loaders con CSS Puro](https://miguelmanchego.com/2024/12/04/como-crear-4-spinners-loaders-con-css-puro/) ## ¿Necesitas ayuda? Si requieres ayuda para desarrollar tu sitio web, crear plugins para Wordpress o módulos personalizados para Elementor a precio razonable. [Contáctame](https://miguelmanchego.com/contactanos/) Miguel Manchego, Todos los derechos reservados 2024
Readable Markdown	Hace un tiempo publiqué un tutorial explicando como como [ocultar o mostrar un elemento](https://www.miguelmanchego.com/2009/ajax-ocultar-mostrar-secciones-de-nuestro-sitio/), pero también es posible hacerlo con múltiples elementos sin tener que agregar un script por cada elemento, para eso hay que usar id que identifiquen a los elementos y clases para conocer su estado. Simplemente con fines didácticos he planteado el ejemplo usando el evento onclick y usando clases sin embargo es posible simplificarlo mucho más asignando el click desde jquery y no usando clases sino atributos. ### El HTML de los elementos \[cc lang=»html»\] \[/cc\] Es posible usar cuantos elementos se requieran y puede usarse cualquier tipo de elemento no exclusivamente div, basta que les pongamos un id y la clase que me indica su estado (visible/invisible) Para el menu que muestra u oculta los elementos, sería el siguiente script: \[cc lang=»html»\] - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) - [Oculta/Muestra](https://miguelmanchego.com/2010/08/24/jquery-ocultar-mostrar-varios-elementos/) \[/cc\] ### La función para ocultar/mostrar usando jquery Como vemos el menu invoca a una función llamada «oculta» y le envía como parámetro el id del elemento que queremos ocultar o mostrar según sea el caso, una vez que capturamos ese elemento pasamos a verificar si esta o no visible para finalmente aplicarle una pequeña animación según sea el caso. \[cc lang=»javascript»\] function oculta(elemento) { ///// capturamos el elemento item=\$(«\#»+elemento); ///// verificamos su estado if(\$(item).hasClass(‘visible’)) { \$(item).removeClass(‘visible’); //// cambiamos su estado \$(item).addClass(‘invisible’); //// animamos \$(item).slideUp(‘fast’); } else { \$(item).removeClass(‘invisible’); \$(item).addClass(‘visible’); \$(item).slideDown(‘fast’); } } \[/cc\] [Demo](https://www.miguelmanchego.com/wp-content/demos/jquery/ocultar-elementos2)
ML Classification
ML Categories	null
ML Page Types	null
ML Intent Types	null
Content Metadata
Language	es
Author	null
Publish Time	2010-08-24 11:51:34 (15 years ago)
Original Publish Time	2010-08-24 11:51:34 (15 years ago)
Republished	No
Word Count (Total)	356
Word Count (Content)	246
Links
External Links	0
Internal Links	23
Technical SEO
Meta Nofollow	No
Meta Noarchive	No
JS Rendered	No
Redirect Target	null
Performance
Download Time (ms)	903
TTFB (ms)	902
Download Size (bytes)	14,702
Shard	32 (laksa)
Root Hash	7995146238140876632
Unparsed URL	com,miguelmanchego!/2010/08/24/jquery-ocultar-mostrar-varios-elementos/ s443