SlideShare una empresa de Scribd logo
Ing. Eric Huiza Pereyra .Net Senior Developer QUADREM The Global eMarket Place www.quadrem.com
HTML. JavaScript.
Hyper Text Markup Language . Lenguaje basado en texto utilizado para la  definición  de hipertexto. Utilizado para la definicion de formatos. Problemas en su uso por diferentes navegadores.
Estructura de un documento HTML. <html> <body> <p> Mi Primera página Web. </p> </body> </html>
Etiqueta HTML. Establece el inicio y fin de un documento HTML. <html> …… </html> Etiqueta Body. Establece el contenido de la pagina Web. <html> <body> …… . </body> </html>
Etiqueta Header. Se utiliza para colocar referencias a la pagina Web, meta tags, y el titulo. <html> <header> <title>Mi Primera Página Web</title> <LINK href=&quot;Styles.css&quot; type=&quot;text/css&quot; rel=&quot;stylesheet&quot;> <script language=”javascript” src=”menú.js”></script> </header> <body> … .. </body> </html>
Etiquetas H1, H2, H3, H4, H5 <h1>Mi Primera página Web.</h1> Etiqueta P <p> Este es mi primer párrafo de texto en una pagina web. </p> Etiqueta A <a href=&quot;javascript:functionJS();&quot;>Link a una funcion javascript</a> <a href=&quot;http://www.google.com&quot;>Link a otra pagina web.</a> <a href=&quot;C:rchivo.pdf&quot;>Link a un archivo pdf</a>
Etiqueta IMG <img src=&quot;C:magen01.jpg&quot; alt=&quot;Imagen 01&quot; /> <img src=&quot;FileServer$magen01.jpg&quot; alt=&quot;Imagen 01&quot; /><img src=&quot;http://misitioweb/imagener/Imagen01.jpg&quot; alt=&quot;Imagen 01&quot; /> Etiqueta HR   <p>Primer Parrafo.</p> <hr /> <p>Segnudo Parrafo.</p> Etiqueta BR <p>Primer Parrafo.</p> <br /> <p>Segnudo Parrafo.</p>
Etiqueta DIV <div> <p>Parrafo 1</p> <hr /> <p>Parrafo 2</p> </div> <br /> <div> <p>Parrafo 3</p> <hr /> <p>Parrafo 4</p> </div> Etiqueta SPAN <span>Etiqueta 1</span>
Etiqueta Table <table width=“100%” border=“1”> … . </table> Etiqueta TR <table> <tr>….</tr> </table>
Etiqueta TD <table> <tr> <td>Celda 1</td> </tr> </table> Etiqueta TH <table> <tr> <th>Titulo</th> </tr> </table>
Permiten ingresar información por el usuario. GET. POST. Los principales controles son. <input type=“text”> <input type=“button”> <input type=“submit”> <input type=“checkbox”> <input type=“radiobutton”> <input type=“hidden”>. <select>, <textarea> … .
Las paginas Web que solo cuentan con HTML son páginas estáticas con poco contenido y poca interacción con el usuario. JavaScript es un lenguaje interpretado que se ejecuta en el navegador o en algún motor de ejecución de scripts. No es estándar en todos los navegadores.
Declaración de variables. Las variables no necesitan ser declaradas, pero por buenas practicas deberían serlo. var _numero1; var _numero2; Construcciones de decisión. De la misma forma que otros lenguajes de programación con sintaxis derivada de C, soporta las estructuras de decisión if, switch y el operador ternario.
Construcciones de iteración. Soporta las estructuras for, while, do while y for in. Depuración. Activación de la instrucción debugger. Creación de funciones. Se crean funciones de la misma forma que en C, pero no se especifican tipos.
Acceso a objetos de la pagina Web. A través del modelo de objetos de documentos DOM, podemos acceder a los objetos y controles de una pagina web a través de JavaScript. Permite una fuerte interacción con el usuario.
<script type=&quot;text/javascript&quot; language=&quot;javascript&quot;> var _operacion = '+'; var _numero1 = 1000; var _numero2 = 100; var _result; switch (_operacion) { case '+': _result = _numero1 + _numero2;  break; case '-': _result = _numero1 - _numero2;  break; case '*': _result = _numero1 * _numero2;  break; case '/': _result = _numero1 / _numero2;  break; } var _isvalid = _result > 0?true:false; if (_isvalid) alert(_result); </script>

Más contenido relacionado

La actualidad más candente

Hojas de Estilos en Cascada (CSS) - Apuntes
Hojas de Estilos en Cascada (CSS) - ApuntesHojas de Estilos en Cascada (CSS) - Apuntes
Hojas de Estilos en Cascada (CSS) - Apuntes
Fernando Irigaray
 
Qué Son Las Css
Qué Son Las CssQué Son Las Css
Qué Son Las Css
Maximiliano Martin
 
Introducción a CSS Parte - 1
Introducción a CSS Parte - 1Introducción a CSS Parte - 1
Introducción a CSS Parte - 1
Jorge Llanten
 
Curso Html
Curso HtmlCurso Html
Qué es html
Qué es htmlQué es html
Qué es html
edujoso
 
04 Marcas HTML
04 Marcas HTML04 Marcas HTML
04 Marcas HTML
pizarg0
 
Introhtml
IntrohtmlIntrohtml
Clase22
Clase22Clase22
Html3
Html3Html3
Cómo instalar o cambiar una plantilla en el
Cómo instalar o cambiar una plantilla en elCómo instalar o cambiar una plantilla en el
Cómo instalar o cambiar una plantilla en el
Ramón Sanchez
 
Fundamentos HTML - Web 2.0
Fundamentos HTML - Web 2.0Fundamentos HTML - Web 2.0
Fundamentos HTML - Web 2.0
Raymond Marquina
 
Htm lpowerpoint
Htm lpowerpointHtm lpowerpoint
Htm lpowerpoint
Maribel Ruiz
 
Htm lpowerpoint
Htm lpowerpointHtm lpowerpoint
Htm lpowerpoint
GREEN GARDEN
 
Tutorial ayuda para tu blog
Tutorial ayuda para tu blogTutorial ayuda para tu blog
Tutorial ayuda para tu blog
Ramón Sanchez
 

La actualidad más candente (14)

Hojas de Estilos en Cascada (CSS) - Apuntes
Hojas de Estilos en Cascada (CSS) - ApuntesHojas de Estilos en Cascada (CSS) - Apuntes
Hojas de Estilos en Cascada (CSS) - Apuntes
 
Qué Son Las Css
Qué Son Las CssQué Son Las Css
Qué Son Las Css
 
Introducción a CSS Parte - 1
Introducción a CSS Parte - 1Introducción a CSS Parte - 1
Introducción a CSS Parte - 1
 
Curso Html
Curso HtmlCurso Html
Curso Html
 
Qué es html
Qué es htmlQué es html
Qué es html
 
04 Marcas HTML
04 Marcas HTML04 Marcas HTML
04 Marcas HTML
 
Introhtml
IntrohtmlIntrohtml
Introhtml
 
Clase22
Clase22Clase22
Clase22
 
Html3
Html3Html3
Html3
 
Cómo instalar o cambiar una plantilla en el
Cómo instalar o cambiar una plantilla en elCómo instalar o cambiar una plantilla en el
Cómo instalar o cambiar una plantilla en el
 
Fundamentos HTML - Web 2.0
Fundamentos HTML - Web 2.0Fundamentos HTML - Web 2.0
Fundamentos HTML - Web 2.0
 
Htm lpowerpoint
Htm lpowerpointHtm lpowerpoint
Htm lpowerpoint
 
Htm lpowerpoint
Htm lpowerpointHtm lpowerpoint
Htm lpowerpoint
 
Tutorial ayuda para tu blog
Tutorial ayuda para tu blogTutorial ayuda para tu blog
Tutorial ayuda para tu blog
 

Similar a Html Y Javascript

Javascript
JavascriptJavascript
PHP
PHPPHP
Codigos HTML Continuación
Codigos HTML ContinuaciónCodigos HTML Continuación
Codigos HTML Continuación
guestc906c2
 
Practica Html1
Practica Html1Practica Html1
Practica Html1
Josué Fortis
 
Cont clase de lenguaje IV
Cont clase de lenguaje IVCont clase de lenguaje IV
Cont clase de lenguaje IV
guestc906c2
 
Symfony2: Interacción con CSS, JS y HTML5
Symfony2: Interacción con CSS, JS y HTML5Symfony2: Interacción con CSS, JS y HTML5
Symfony2: Interacción con CSS, JS y HTML5
Raul Fraile
 
HTML
HTMLHTML
Diapo02
Diapo02Diapo02
Js
JsJs
C:\Documents And Settings\Alumno\Mis Documentos\Qué Es Html
C:\Documents And Settings\Alumno\Mis Documentos\Qué Es HtmlC:\Documents And Settings\Alumno\Mis Documentos\Qué Es Html
C:\Documents And Settings\Alumno\Mis Documentos\Qué Es Html
edujoso
 
Trabajo final programacion
Trabajo final programacionTrabajo final programacion
Trabajo final programacion
markos1992
 
Introducción al desarrollo web
Introducción al desarrollo webIntroducción al desarrollo web
Introducción al desarrollo web
Marcos Vanetta
 
Clase06
Clase06Clase06
HTML
HTMLHTML
HTML
Migueljpp
 
Blog
BlogBlog
Blog
cucutras
 
Guía básica para pegarle al xhtml (Primera parte)
Guía básica para pegarle al xhtml (Primera parte)Guía básica para pegarle al xhtml (Primera parte)
Guía básica para pegarle al xhtml (Primera parte)
Carlos Caicedo
 
Tpd 03
Tpd 03Tpd 03
HTML5 Enfoque Semantico
HTML5 Enfoque SemanticoHTML5 Enfoque Semantico
HTML5 Enfoque Semantico
Max Kraszewski
 
PresentacióN Html
PresentacióN HtmlPresentacióN Html
PresentacióN Html
marcos0209
 
PresentacióN Html
PresentacióN HtmlPresentacióN Html
PresentacióN Html
Margarita T.
 

Similar a Html Y Javascript (20)

Javascript
JavascriptJavascript
Javascript
 
PHP
PHPPHP
PHP
 
Codigos HTML Continuación
Codigos HTML ContinuaciónCodigos HTML Continuación
Codigos HTML Continuación
 
Practica Html1
Practica Html1Practica Html1
Practica Html1
 
Cont clase de lenguaje IV
Cont clase de lenguaje IVCont clase de lenguaje IV
Cont clase de lenguaje IV
 
Symfony2: Interacción con CSS, JS y HTML5
Symfony2: Interacción con CSS, JS y HTML5Symfony2: Interacción con CSS, JS y HTML5
Symfony2: Interacción con CSS, JS y HTML5
 
HTML
HTMLHTML
HTML
 
Diapo02
Diapo02Diapo02
Diapo02
 
Js
JsJs
Js
 
C:\Documents And Settings\Alumno\Mis Documentos\Qué Es Html
C:\Documents And Settings\Alumno\Mis Documentos\Qué Es HtmlC:\Documents And Settings\Alumno\Mis Documentos\Qué Es Html
C:\Documents And Settings\Alumno\Mis Documentos\Qué Es Html
 
Trabajo final programacion
Trabajo final programacionTrabajo final programacion
Trabajo final programacion
 
Introducción al desarrollo web
Introducción al desarrollo webIntroducción al desarrollo web
Introducción al desarrollo web
 
Clase06
Clase06Clase06
Clase06
 
HTML
HTMLHTML
HTML
 
Blog
BlogBlog
Blog
 
Guía básica para pegarle al xhtml (Primera parte)
Guía básica para pegarle al xhtml (Primera parte)Guía básica para pegarle al xhtml (Primera parte)
Guía básica para pegarle al xhtml (Primera parte)
 
Tpd 03
Tpd 03Tpd 03
Tpd 03
 
HTML5 Enfoque Semantico
HTML5 Enfoque SemanticoHTML5 Enfoque Semantico
HTML5 Enfoque Semantico
 
PresentacióN Html
PresentacióN HtmlPresentacióN Html
PresentacióN Html
 
PresentacióN Html
PresentacióN HtmlPresentacióN Html
PresentacióN Html
 

Más de oswchavez

Html Y Javascript
Html Y JavascriptHtml Y Javascript
Html Y Javascript
oswchavez
 
Booa8 Slide 12
Booa8 Slide 12Booa8 Slide 12
Booa8 Slide 12
oswchavez
 
Asp .Net Parte 1
Asp .Net Parte 1Asp .Net Parte 1
Asp .Net Parte 1
oswchavez
 
Booa8 Slide 11
Booa8 Slide 11Booa8 Slide 11
Booa8 Slide 11
oswchavez
 
Booa8 Slide 09
Booa8 Slide 09Booa8 Slide 09
Booa8 Slide 09
oswchavez
 
Booa8 Slide 07
Booa8 Slide 07Booa8 Slide 07
Booa8 Slide 07
oswchavez
 
Booa8 Slide 04
Booa8 Slide 04Booa8 Slide 04
Booa8 Slide 04
oswchavez
 
Booa8 Slide 03
Booa8 Slide 03Booa8 Slide 03
Booa8 Slide 03
oswchavez
 
Booa8 Slide 02
Booa8 Slide 02Booa8 Slide 02
Booa8 Slide 02
oswchavez
 
Booa8 Slide 01
Booa8 Slide 01Booa8 Slide 01
Booa8 Slide 01
oswchavez
 
Booa8 Slide 03
Booa8 Slide 03Booa8 Slide 03
Booa8 Slide 03
oswchavez
 
Pb11 002 1 Metodologia
Pb11 002 1 MetodologiaPb11 002 1 Metodologia
Pb11 002 1 Metodologia
oswchavez
 
Pb11 002 0 Problematica
Pb11 002 0 ProblematicaPb11 002 0 Problematica
Pb11 002 0 Problematica
oswchavez
 
Pb11 003 Overview
Pb11 003 OverviewPb11 003 Overview
Pb11 003 Overview
oswchavez
 
P B11 001 Intro
P B11 001  IntroP B11 001  Intro
P B11 001 Intro
oswchavez
 
Pb110021 Metodologia
Pb110021 MetodologiaPb110021 Metodologia
Pb110021 Metodologia
oswchavez
 
Pb11002 Problematica
Pb11002 ProblematicaPb11002 Problematica
Pb11002 Problematica
oswchavez
 
IntroduccióN A Visual C
IntroduccióN A  Visual  CIntroduccióN A  Visual  C
IntroduccióN A Visual C
oswchavez
 
Net Windows Developer Parte 1
Net  Windows  Developer  Parte 1Net  Windows  Developer  Parte 1
Net Windows Developer Parte 1
oswchavez
 
Clase01 Generalidades De Las Estructuras
Clase01   Generalidades De Las EstructurasClase01   Generalidades De Las Estructuras
Clase01 Generalidades De Las Estructuras
oswchavez
 

Más de oswchavez (20)

Html Y Javascript
Html Y JavascriptHtml Y Javascript
Html Y Javascript
 
Booa8 Slide 12
Booa8 Slide 12Booa8 Slide 12
Booa8 Slide 12
 
Asp .Net Parte 1
Asp .Net Parte 1Asp .Net Parte 1
Asp .Net Parte 1
 
Booa8 Slide 11
Booa8 Slide 11Booa8 Slide 11
Booa8 Slide 11
 
Booa8 Slide 09
Booa8 Slide 09Booa8 Slide 09
Booa8 Slide 09
 
Booa8 Slide 07
Booa8 Slide 07Booa8 Slide 07
Booa8 Slide 07
 
Booa8 Slide 04
Booa8 Slide 04Booa8 Slide 04
Booa8 Slide 04
 
Booa8 Slide 03
Booa8 Slide 03Booa8 Slide 03
Booa8 Slide 03
 
Booa8 Slide 02
Booa8 Slide 02Booa8 Slide 02
Booa8 Slide 02
 
Booa8 Slide 01
Booa8 Slide 01Booa8 Slide 01
Booa8 Slide 01
 
Booa8 Slide 03
Booa8 Slide 03Booa8 Slide 03
Booa8 Slide 03
 
Pb11 002 1 Metodologia
Pb11 002 1 MetodologiaPb11 002 1 Metodologia
Pb11 002 1 Metodologia
 
Pb11 002 0 Problematica
Pb11 002 0 ProblematicaPb11 002 0 Problematica
Pb11 002 0 Problematica
 
Pb11 003 Overview
Pb11 003 OverviewPb11 003 Overview
Pb11 003 Overview
 
P B11 001 Intro
P B11 001  IntroP B11 001  Intro
P B11 001 Intro
 
Pb110021 Metodologia
Pb110021 MetodologiaPb110021 Metodologia
Pb110021 Metodologia
 
Pb11002 Problematica
Pb11002 ProblematicaPb11002 Problematica
Pb11002 Problematica
 
IntroduccióN A Visual C
IntroduccióN A  Visual  CIntroduccióN A  Visual  C
IntroduccióN A Visual C
 
Net Windows Developer Parte 1
Net  Windows  Developer  Parte 1Net  Windows  Developer  Parte 1
Net Windows Developer Parte 1
 
Clase01 Generalidades De Las Estructuras
Clase01   Generalidades De Las EstructurasClase01   Generalidades De Las Estructuras
Clase01 Generalidades De Las Estructuras
 

Último

Historia de Tributación Memoria Institucional 2021-SUNAT
Historia de Tributación Memoria Institucional 2021-SUNATHistoria de Tributación Memoria Institucional 2021-SUNAT
Historia de Tributación Memoria Institucional 2021-SUNAT
GiovannaSantaCruzHui
 
PROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOS
PROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOSPROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOS
PROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOS
ppgzzsantos
 
Trabajo - Mapa de Transformación Digital.docx
Trabajo - Mapa de Transformación Digital.docxTrabajo - Mapa de Transformación Digital.docx
Trabajo - Mapa de Transformación Digital.docx
Walter Marzal
 
U4 S2 FICHA D4 PLAN LECTOR VICUÑITA DEL ALTIPLANO.pdf
U4 S2 FICHA D4 PLAN LECTOR VICUÑITA  DEL ALTIPLANO.pdfU4 S2 FICHA D4 PLAN LECTOR VICUÑITA  DEL ALTIPLANO.pdf
U4 S2 FICHA D4 PLAN LECTOR VICUÑITA DEL ALTIPLANO.pdf
DaidaniaHC
 
Programa Generación Digital para Pymes Extremadura
Programa Generación Digital para Pymes ExtremaduraPrograma Generación Digital para Pymes Extremadura
Programa Generación Digital para Pymes Extremadura
Dirección General de Empresa
 
1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx
1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx
1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx
BREYNERMEJIAGUERRERO1
 
02 - Running Lean - Lean Canvas00758.pdf
02 - Running Lean - Lean Canvas00758.pdf02 - Running Lean - Lean Canvas00758.pdf
02 - Running Lean - Lean Canvas00758.pdf
Juan Carlos
 
EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.
EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.
EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.
JHAZMINRODRIGUEZPERE
 
10-20-30 proyecto crea y emprende (1) - copia.pptx
10-20-30  proyecto crea y emprende (1) - copia.pptx10-20-30  proyecto crea y emprende (1) - copia.pptx
10-20-30 proyecto crea y emprende (1) - copia.pptx
marco385820
 
Carta-porte_SAE_ADM_Facture_SiigoNube (1).pdf
Carta-porte_SAE_ADM_Facture_SiigoNube (1).pdfCarta-porte_SAE_ADM_Facture_SiigoNube (1).pdf
Carta-porte_SAE_ADM_Facture_SiigoNube (1).pdf
Cade Soluciones
 
reforma pensional Presentación Universidad Libre.pdf
reforma pensional Presentación Universidad Libre.pdfreforma pensional Presentación Universidad Libre.pdf
reforma pensional Presentación Universidad Libre.pdf
1024527331
 
presentación ejecutiva es un trabajo realizado en la universidad UVEG
presentación ejecutiva es un trabajo realizado en la universidad UVEGpresentación ejecutiva es un trabajo realizado en la universidad UVEG
presentación ejecutiva es un trabajo realizado en la universidad UVEG
AlejandroRodriguez873289
 
Ley Karin Material para empresa Emps.pdf
Ley Karin Material para empresa Emps.pdfLey Karin Material para empresa Emps.pdf
Ley Karin Material para empresa Emps.pdf
ssuser0a8da9
 
CANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADAS
CANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADASCANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADAS
CANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADAS
jennychavez44
 
NUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptx
NUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptxNUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptx
NUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptx
fernandodavilapinill1
 
Discurso Gerencial en Venezuela desde la era Industrial hasta la actualidad I
Discurso Gerencial en Venezuela desde la era Industrial hasta la actualidad IDiscurso Gerencial en Venezuela desde la era Industrial hasta la actualidad I
Discurso Gerencial en Venezuela desde la era Industrial hasta la actualidad I
estherarcila
 
SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...
SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...
SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...
BreenIzarraBrea
 

Último (17)

Historia de Tributación Memoria Institucional 2021-SUNAT
Historia de Tributación Memoria Institucional 2021-SUNATHistoria de Tributación Memoria Institucional 2021-SUNAT
Historia de Tributación Memoria Institucional 2021-SUNAT
 
PROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOS
PROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOSPROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOS
PROSHOW PRESENTACION JULIO 2024 ÚLTIMOS EVENTOS
 
Trabajo - Mapa de Transformación Digital.docx
Trabajo - Mapa de Transformación Digital.docxTrabajo - Mapa de Transformación Digital.docx
Trabajo - Mapa de Transformación Digital.docx
 
U4 S2 FICHA D4 PLAN LECTOR VICUÑITA DEL ALTIPLANO.pdf
U4 S2 FICHA D4 PLAN LECTOR VICUÑITA  DEL ALTIPLANO.pdfU4 S2 FICHA D4 PLAN LECTOR VICUÑITA  DEL ALTIPLANO.pdf
U4 S2 FICHA D4 PLAN LECTOR VICUÑITA DEL ALTIPLANO.pdf
 
Programa Generación Digital para Pymes Extremadura
Programa Generación Digital para Pymes ExtremaduraPrograma Generación Digital para Pymes Extremadura
Programa Generación Digital para Pymes Extremadura
 
1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx
1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx
1.3. Introduccion-a-la-auditoria-del-efectivo-y-equivalentes-de-efectivo.pptx
 
02 - Running Lean - Lean Canvas00758.pdf
02 - Running Lean - Lean Canvas00758.pdf02 - Running Lean - Lean Canvas00758.pdf
02 - Running Lean - Lean Canvas00758.pdf
 
EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.
EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.
EL WARRANT, exposision del Warrant, diapositivas ordenadas y explicativas.
 
10-20-30 proyecto crea y emprende (1) - copia.pptx
10-20-30  proyecto crea y emprende (1) - copia.pptx10-20-30  proyecto crea y emprende (1) - copia.pptx
10-20-30 proyecto crea y emprende (1) - copia.pptx
 
Carta-porte_SAE_ADM_Facture_SiigoNube (1).pdf
Carta-porte_SAE_ADM_Facture_SiigoNube (1).pdfCarta-porte_SAE_ADM_Facture_SiigoNube (1).pdf
Carta-porte_SAE_ADM_Facture_SiigoNube (1).pdf
 
reforma pensional Presentación Universidad Libre.pdf
reforma pensional Presentación Universidad Libre.pdfreforma pensional Presentación Universidad Libre.pdf
reforma pensional Presentación Universidad Libre.pdf
 
presentación ejecutiva es un trabajo realizado en la universidad UVEG
presentación ejecutiva es un trabajo realizado en la universidad UVEGpresentación ejecutiva es un trabajo realizado en la universidad UVEG
presentación ejecutiva es un trabajo realizado en la universidad UVEG
 
Ley Karin Material para empresa Emps.pdf
Ley Karin Material para empresa Emps.pdfLey Karin Material para empresa Emps.pdf
Ley Karin Material para empresa Emps.pdf
 
CANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADAS
CANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADASCANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADAS
CANACERO NORMAS.pdf NORMAS 2024 ACTUALIZADAS
 
NUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptx
NUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptxNUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptx
NUEVA PRESENTACION NUEVA CONSULTORIAS COSTED SRL 2024-2025.pptx
 
Discurso Gerencial en Venezuela desde la era Industrial hasta la actualidad I
Discurso Gerencial en Venezuela desde la era Industrial hasta la actualidad IDiscurso Gerencial en Venezuela desde la era Industrial hasta la actualidad I
Discurso Gerencial en Venezuela desde la era Industrial hasta la actualidad I
 
SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...
SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...
SITUACION DE LAS PIELES DE CAMELIDOS Y POSIBILIDADES DE DESRROLLO D LA CURTIE...
 

Html Y Javascript

  • 1. Ing. Eric Huiza Pereyra .Net Senior Developer QUADREM The Global eMarket Place www.quadrem.com
  • 3. Hyper Text Markup Language . Lenguaje basado en texto utilizado para la definición de hipertexto. Utilizado para la definicion de formatos. Problemas en su uso por diferentes navegadores.
  • 4. Estructura de un documento HTML. <html> <body> <p> Mi Primera página Web. </p> </body> </html>
  • 5. Etiqueta HTML. Establece el inicio y fin de un documento HTML. <html> …… </html> Etiqueta Body. Establece el contenido de la pagina Web. <html> <body> …… . </body> </html>
  • 6. Etiqueta Header. Se utiliza para colocar referencias a la pagina Web, meta tags, y el titulo. <html> <header> <title>Mi Primera Página Web</title> <LINK href=&quot;Styles.css&quot; type=&quot;text/css&quot; rel=&quot;stylesheet&quot;> <script language=”javascript” src=”menú.js”></script> </header> <body> … .. </body> </html>
  • 7. Etiquetas H1, H2, H3, H4, H5 <h1>Mi Primera página Web.</h1> Etiqueta P <p> Este es mi primer párrafo de texto en una pagina web. </p> Etiqueta A <a href=&quot;javascript:functionJS();&quot;>Link a una funcion javascript</a> <a href=&quot;http://www.google.com&quot;>Link a otra pagina web.</a> <a href=&quot;C:rchivo.pdf&quot;>Link a un archivo pdf</a>
  • 8. Etiqueta IMG <img src=&quot;C:magen01.jpg&quot; alt=&quot;Imagen 01&quot; /> <img src=&quot;FileServer$magen01.jpg&quot; alt=&quot;Imagen 01&quot; /><img src=&quot;http://misitioweb/imagener/Imagen01.jpg&quot; alt=&quot;Imagen 01&quot; /> Etiqueta HR <p>Primer Parrafo.</p> <hr /> <p>Segnudo Parrafo.</p> Etiqueta BR <p>Primer Parrafo.</p> <br /> <p>Segnudo Parrafo.</p>
  • 9. Etiqueta DIV <div> <p>Parrafo 1</p> <hr /> <p>Parrafo 2</p> </div> <br /> <div> <p>Parrafo 3</p> <hr /> <p>Parrafo 4</p> </div> Etiqueta SPAN <span>Etiqueta 1</span>
  • 10. Etiqueta Table <table width=“100%” border=“1”> … . </table> Etiqueta TR <table> <tr>….</tr> </table>
  • 11. Etiqueta TD <table> <tr> <td>Celda 1</td> </tr> </table> Etiqueta TH <table> <tr> <th>Titulo</th> </tr> </table>
  • 12. Permiten ingresar información por el usuario. GET. POST. Los principales controles son. <input type=“text”> <input type=“button”> <input type=“submit”> <input type=“checkbox”> <input type=“radiobutton”> <input type=“hidden”>. <select>, <textarea> … .
  • 13. Las paginas Web que solo cuentan con HTML son páginas estáticas con poco contenido y poca interacción con el usuario. JavaScript es un lenguaje interpretado que se ejecuta en el navegador o en algún motor de ejecución de scripts. No es estándar en todos los navegadores.
  • 14. Declaración de variables. Las variables no necesitan ser declaradas, pero por buenas practicas deberían serlo. var _numero1; var _numero2; Construcciones de decisión. De la misma forma que otros lenguajes de programación con sintaxis derivada de C, soporta las estructuras de decisión if, switch y el operador ternario.
  • 15. Construcciones de iteración. Soporta las estructuras for, while, do while y for in. Depuración. Activación de la instrucción debugger. Creación de funciones. Se crean funciones de la misma forma que en C, pero no se especifican tipos.
  • 16. Acceso a objetos de la pagina Web. A través del modelo de objetos de documentos DOM, podemos acceder a los objetos y controles de una pagina web a través de JavaScript. Permite una fuerte interacción con el usuario.
  • 17. <script type=&quot;text/javascript&quot; language=&quot;javascript&quot;> var _operacion = '+'; var _numero1 = 1000; var _numero2 = 100; var _result; switch (_operacion) { case '+': _result = _numero1 + _numero2; break; case '-': _result = _numero1 - _numero2; break; case '*': _result = _numero1 * _numero2; break; case '/': _result = _numero1 / _numero2; break; } var _isvalid = _result > 0?true:false; if (_isvalid) alert(_result); </script>