{"id":712,"date":"2024-07-30T20:23:51","date_gmt":"2024-07-30T18:23:51","guid":{"rendered":"https:\/\/blog.sutilweb.eu\/?page_id=712"},"modified":"2024-07-30T20:23:51","modified_gmt":"2024-07-30T18:23:51","slug":"005-alert-confirm-y-prompt","status":"publish","type":"page","link":"https:\/\/sutilweb.eu\/index.php\/lenguajes\/javascript\/javascript-practico\/06-objetos-y-funciones-del-lenguaje\/005-alert-confirm-y-prompt\/","title":{"rendered":"005. alert, confirm y prompt"},"content":{"rendered":"\n

En este cap\u00edtulo vamos a ver 3 m\u00e9todos<\/strong> que son muy importantes para interactuar con el usuario, y que cuelgan del objeto padre que es window<\/em> <\/strong>en los navegadores. Estos m\u00e9todos<\/strong> no existen en Node.js<\/strong> ya que no existe el objeto window<\/em><\/strong>, pero s\u00ed que existen en el Javascript<\/strong> de los navegadores, y muy importante, aunque a\u00fan no hemos visto nada del DOM<\/strong> ni del BOM<\/strong>, que ya es m\u00e1s interacci\u00f3n con HTML<\/strong>, s\u00ed es importante explicar estos 3 m\u00e9todos de la ventana.<\/p>\n\n\n\n\n\n\n\n

Estos 3 m\u00e9todos nos permiten interactuar con el usuario.<\/p>\n\n\n\n

La diferencia entre un alert<\/em> <\/strong>y un confirm<\/em> <\/strong>es que mientras que alert<\/em><\/strong> (alerta) s\u00f3lo tiene un bot\u00f3n de Aceptar, confirm<\/em> <\/strong>(confirmaci\u00f3n) tiene un bot\u00f3n de Aceptar y uno de Cancelar, y dependiendo de lo que el usuario pulse, validar\u00e1 a true<\/em> <\/strong>o false<\/em><\/strong>.<\/p>\n\n\n\n

El prompt <\/em><\/strong>(aviso) permite que el usuario interact\u00fae y facilite un valor, es decir, le permite ingresar un valor.<\/p>\n\n\n\n

Aunque son m\u00e9todos<\/strong> que cuelgan de window<\/em><\/strong>, no es necesario especificar la palabra window<\/em> <\/strong>para llamar a dichos m\u00e9todos<\/strong>.<\/p>\n\n\n\n

La alerta nos va a mostrar undefined<\/em><\/strong>, la confirmaci\u00f3n nos puede mostrar true<\/em> <\/strong>o false<\/em><\/strong>, y el aviso (prompt<\/em><\/strong>), si no ingresamos nada y le damos a aceptar nos dar\u00e1 una cadena vac\u00eda, si le damos al bot\u00f3n Cancelar retornar\u00e1 un valor null<\/em><\/strong>, por ello una alerta manda mensaje al usuario s\u00f3lamente, la confirmaci\u00f3n si le damos al bot\u00f3n de aceptar, guarda dicha confirmaci\u00f3n en una variable y retorna el valor true<\/em><\/strong>, si damos clic en Cancelar no se guarda dicha confirmaci\u00f3n en una variable y retorna un valor false<\/em><\/strong>, y el aviso, si escribimos algo y le damos a aceptar, devolver\u00e1 una cadena de texto, si no escribimos nada y damos clic a aceptar, devolver\u00e1 una cadena de texto vac\u00eda, y si damos a Cancelar, independientemente de que hayamos escrito algo o no, retornar\u00e1 un valor null<\/em><\/strong>.<\/p>\n\n\n\n

Ejm<\/strong><\/p>\n\n\n\n

<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"UTF-8\" \/>\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" \/>\n    <title>Alert, Confirm, Prompt<\/title>\n  <\/head>\n\n  <body>\n    <h1>Alert, Confirm, Prompt<\/h1>\n\n    <script>\n      \/\/ window.alert(\"Hola esto es una alerta\");\n      \/\/ window.confirm(\"Hola esto es una confirmaci\u00f3n\");\n      \/* window.prompt(\n        \"Hola esto es un prompt y permite al usuario ingresar un valor\"\n      ); *\/\n\n      let alerta = alert(\"Esto es una alerta\");\n      let confirmacion = confirm(\"Esto es una confirmaci\u00f3n\");\n      let aviso = prompt(\"Esto es un aviso\");\n\n      console.log(alerta);\n      console.log(confirmacion);\n      console.log(aviso);\n    <\/script>\n  <\/body>\n<\/html><\/pre>\n","protected":false},"excerpt":{"rendered":"
En este cap\u00edtulo vamos a ver 3 m\u00e9todos que son muy importantes para interactuar con el usuario, y que cuelgan del objeto padre que es window en los navegadores. Estos m\u00e9todos no existen en Node.js ya que no existe el objeto window, pero s\u00ed que existen en el Javascript de los navegadores, y muy importante, […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":697,"menu_order":4,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-712","page","type-page","status-publish","hentry"],"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false},"uagb_author_info":{"display_name":"Sutil Web","author_link":"https:\/\/sutilweb.eu\/index.php\/author\/sutilweb\/"},"uagb_comment_info":0,"uagb_excerpt":"En este cap\u00edtulo vamos a ver 3 m\u00e9todos que son muy importantes para interactuar con el usuario, y que cuelgan del objeto padre que es window en los navegadores. Estos m\u00e9todos no existen en Node.js ya que no existe el objeto window, pero s\u00ed que existen en el Javascript de los navegadores, y muy importante,…","_links":{"self":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/712","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/comments?post=712"}],"version-history":[{"count":1,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/712\/revisions"}],"predecessor-version":[{"id":713,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/712\/revisions\/713"}],"up":[{"embeddable":true,"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/pages\/697"}],"wp:attachment":[{"href":"https:\/\/sutilweb.eu\/index.php\/wp-json\/wp\/v2\/media?parent=712"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}