martes, 12 de julio de 2016

HTML. (CLASE N°19)

En esta clase, la cual fue la primera después de haber entrado de un periodo de vacaciones dimos el inicio al TERCER BIMESTRE. Nos dirigimos a sala de informática y allí empezamos tema.

HTML es el lenguaje por el cual construimos una página web. Este lenguaje se basa principalmente en etiquetas, con las cuales vamos construyendo los diferentes apartados de nuestra web. Es imprescindible conocer estas etiquetas y su funcionamiento para poder crear o al menos modificar una página web.  


1.ESTRUCTURA:








 Etiquetas básicas de HTML:
* <HTML>: indica el comienzo del documento HTML. 
* <HEAD>: indica que empieza la cabecera de la página. En ella se suele poner el título (<title> de la web, una descripción y otras informaciones relacionadas con el contenido de la página. 
* <BODY>: es el cuerpo de la página, donde va lo que se ve en el navegador al cargar una web. En el body van los textos, las imágenes y todos los contenidos de la web. 
* <H1>, <H2>, etc.: son los títulos o encabezados. Se utilizan para establecer determinados textos de la página como titulares, suelen tener un tamaño de fuente mayor para diferenciarlos del resto del texto. Son importantes en el posicionamiento en buscadores. 
* <A>: define los enlaces. 
* <TABLE>: es una tabla, y dentro de esta tenemos filas <TR> y celdas <TD>. 
* <P>: el texto dentro de esta etiqueta forma un párrafo. 
* <IMG>: imágenes. 
* <BR>: salto de línea. 
* <UL>: los textos dentro de esta etiqueta se estructuran en listas. Mediante el uso de <LI> definimos cada guión dentro de la lista, y usando <OL> en lugar de <UL> tendremos listas ordenadas. 
* <B> y <STRONG>: se utilizan para resaltar el texto. 
* <U>: texto subrayado. 
* <I>: texto en cursiva. 
*<pre>    </pre> PREFORMATIAR UN TEXTO
*<b>    </b> NEGRITA <strong>    </strong>
*<s>    </s> TACHADO
*<hr>    </hr> LINEA HORIZONTAL
*<font color=”#ff0000”>      </font> COLOR A LA LETRA
*<marquee>    </marquee>  MOVIMIENTO

 
Ejemplo de página básica 

<html> 
<head> 
<title>Título de la página</title> 
</head> 
<body> 
<h1>Encabezado de la página</h2> 
<h3>Encabezado de menor tamaño</h3> 
<p>Este es el texto de un párrafo.</p> 
<p>Este es el texto de otro párrafo. Dentro de este párrafo, 
pueden ir palabras <b>en negrita</b>, <i>en cursiva</i> o lo 
que quieras.</p> 
<p>También podemos poner listas como la siguiente:</p> 
<ul> 
<li>Guión número uno.</li> 
<li>Guión número dos.</li> 
<li>Guión número tres.</li> 
</ul> 
</body> 
</html> 

Consejo de Atributos 

bgcolor=?> <body 
Establece el color de fondo, usando nombres o valores hex 
text=?> <body 
Establece el color del texto, usando nombres o valores hex 
link=?> <body 
Establece el color de los enlaces, usando nombres o valores hex 
vlink=?> <body 
Establece el color de los enlaces, usando nombres o valores hex 
alink=?> <body 
Establece el color de los enlaces con un clic 

Etiquetas de texto 

<pre> </ pre> 
Crea texto preformateado 
<h1> </ h1> 
Crea un título grande 
<h6> </ h6> 
Crea un título pequeño 
<b> </ b> 
Crea texto en negrita 
<i> </ i> 
Crea texto en cursiva 
<tt> </ tt> 
Crea, o máquina de escribir estilo de texto-teletipo 
<cite> </ cite> 
Crea una cita, por lo general en cursiva 
<em> </ em> 
Hace hincapié en la palabra (con cursiva o negrita) 
<strong> </ strong> 
Hace hincapié en la palabra (con cursiva o negrita) 
size=?> <font </ font> 
Ajusta tamaño del fuente, de 1 a 7) 
color=?> <font </ font> 
Juegos de color de la fuente, usando nombres o valores hex 

Enlaces 

<a href="URL"> </ a> 
Crea un hipervínculo 
<a href="mailto:EMAIL"> </ a> 
Crea un enlace de correo 
<a name="NAME"> </ a> 
Crea una ubicación de destino dentro de un documento 
<a href="#NAME"> </ a> 
Enlaces a ese lugar de destino en otra parte del documento 

Formato 

<p></p> 
Crea un nuevo párrafo 
align=?> <p 
Alinea un párrafo a la izquierda, derecha o al centro 
<br> 
Inserta un salto de línea 

<blockquote> </ Span> 
Sangría de texto de ambos lados 
<dl> </ dl> 
Crea una lista de definiciones 
<dt> 
Precede cada definición de término 
<dd> 
Precede cada definición 
<ol> </ ol> 
Crea una lista numerada 
<li> </ li> 
Precede a cada elemento de la lista, y añade un número 
<ul> </ ul> 
Crea una lista con viñetas 
align=?> <div 
Un tag genérico utilizado para grandes bloques de formato de HTML, también se utiliza para hojas de estilo 

Elementos gráficos 

<img src="name"> 
Agrega una imagen 
<img src="name" align=?> 
Alinea una imagen: izquierda, derecha, centro;, superior, medio fondo 
<img src="name" border=?> 
Ajusta tamaño del borde alrededor de una imagen 
<hr> 
Inserta una regla horizontal 
size=?> <hr 
Establece el tamaño (altura) de la regla 
width=?> <hr 
Establece la anchura de la regla, en porcentaje o valor absoluto 
noshade> <hr 
Crea una regla sin una sombra 

Tablas 

<table> </ table> 
Crea una tabla 
<tr> </ tr> 
marcha cada fila en una tabla 
<td> </ td> 
Pone en marcha cada celda de una fila 
<th> </ th> 
Pone en marcha la cabecera de la tabla (una celda normal, con negrita, texto centrado) 

Atributos de la tabla 

border=#> <table 
Establece el ancho de borde alrededor de celdas de la tabla 
cellspacing=#> <table 
Ajusta la cantidad de espacio entre las celdas de la tabla 
cellpadding=#> <table 
Ajusta la cantidad de espacio entre el borde de una celda y su contenido 
width=# <table o %> 
Establece la anchura de la mesa - en píxeles o como porcentaje del ancho del documento 
align=?> <tr o align=?> <td 
Establece la alineación de la celda (s) (a la izquierda, centro o derecha) 
valign=?> <tr o valign=?> <td 
Establece la alineación vertical de la celda (s) (, superior, media o inferior) 
<td colspan=#> 
Establece el número de columnas de una celda debe abarcar 
<td rowspan=#> 
Establece el número de filas de una célula debe abarcar (por defecto = 1) 
<td nowrap> 
Evita las líneas dentro de una célula se rompa para adaptarse a 

Frames Marcos 

<frameset> </ frameset> 
etiquetas en un documento marco, también se pueden anidar en otros conjuntos de marcos 
rows="value,value"> <frameset 
Define las filas dentro de un conjunto de marcos, utilizando el número de píxeles, o el porcentaje de ancho de w 
cols="value,value"> <frameset 
Define las columnas dentro de un conjunto de marcos, utilizando el número de píxeles, o el porcentaje de ancho de 
<frame> 
Define un marco único - o región - dentro de un conjunto de marcos 
<NOFRAMES> </ noframes> 
Define lo que aparecerá en navegadores que no soporten marcos 

Marcos Atributos 

src="URL"> <frame 
Especifica que el documento HTML se debe mostrar 
name="name"> <frame 
Nombres de la estructura, o de la región, por lo que puede ser objetivo de otros marcos 
marginwidth=#> <frame 
Define los márgenes izquierdo y derecho del marco, debe ser igual o superior a 1 
marginheight=#> <frame 
Define los márgenes superior e inferior del marco, debe ser igual o superior a 1 
scrolling=VALUE> <frame 
Establece si el marco tiene una barra de desplazamiento, puede ser igual a "sí", "no", o "auto. Valor" El valor por defecto, como en los documentos ordinarios, es automático. 
noresize> <frame 
Impide que el usuario cambiar el tamaño de un marco 

Formularios 
Para las formas funcionales, tendrá que ejecutar un script CGI. El HTML sólo crea la apariencia de un formulario. 
<form> </ form> 
Crea todas las formas 
</select> <select name="nombre" múltiples size=?> </ select> 
Crea un menú desplegable. Tamaño establece el número de elementos de menú visible antes de yo u necesidad de desplazarse. 
<option> 
Pone en marcha cada elemento de menú 
<select name="NAME"> </ select> 
Crea un menú desplegable 
<option> 
Pone en marcha cada elemento de menú 
<textarea name="nombre" cols=40 rows=8> </ textarea> 
Crea un área de la caja de texto. Establecer el ancho de las columnas, filas ajustar la altura. 
<input type="checkbox" name="NAME"> 
Crea una casilla de verificación. Texto siguiente etiqueta. 
<input type="radio" name="nombre" value="x"> 
Crea un botón de radio. Texto sigue etiquetas 
<input type=text name="foo" size=20> 
. Crea una línea de texto y un área. Tamaño establece la longitud, en caracteres. 
<input type="submit" value="NAME"> 
Crea un botón Enviar 
<input type="image" border=0 name="NAME" src="name.gif"> type="image" 
Crea un botón Enviar con una imagen 
type="reset"> <input 
Crea un botón de reinicio 

TOMADO DE: http://www.taringa.net/post/ciencia-educacion/11833897/Etiquetas-basicas-de-html.html

martes, 28 de junio de 2016

EJEMPLOS PRÁCTICOS DE JAVASCRIPT

Visualizar    por pantalla un mensaje de bienvenida

  
ejemplo 1
  
Ejemplo 1  .   Visualizar    por pantalla un mensaje de bienvenida a la página Web.
  
En    nuestro primer ejemplo, simplemente, crearemos un Javascript que lo que hará es    visualizar un mensaje de bienvenida cuando el usuario entre a la página Web. Cada    vez más, las páginas Webs muestran un mensaje de este tipo para dar la    bienvenida cuando se entran en ellas.
  
Como se puede    apreciar el código Javascript se coloca (o se embebe) dentro de uno de HTML, encerrándolo    entre las etiquetas < script>< /script>.
  
Abre el bloc de    Notas, copia el código anterior y guárdalo como Ejemplo01.html. (Si no te    apetece hacer esto puedes abrir el mismo desde el directorio Ejemplos I).    Después, ejecútalo pulsando doble clic con el ratón.
  

Botón para volver hacia atrás

  
ejemplo 2
  
Ejemplo 2. Botón que al ser pulsado vuelve a la página    anterior de la que hubiera en ese momento.
  
Se trata de un botón    para volver hacia atrás, a semejanza del que tenemos en la barra de    herramientas del navegador. Al pulsar el botón se realiza una instrucción    Javascript.
  
Dicha instrucción    Javascript, llamada history.go(-1), se    encuentra dentro de un atributo de HTML, onclick, lo cual indica que esa    instrucción SOLAMENTE se ejecutará cuando    se realice la pulsación del botón, representado por la etiqueta HTML  INPUT. Un poco más técnico, el    evento es pulsar el botón (onclick) y    la acción (history.go(-1)) es volver    a la página anterior en el historial de navegación. Para verlo correctamente,    ejecuta primero Ejemplo01.html! (Necesita el Ejemplo02 alguna página para    volver para atrás).
  

Recoger    un dato por teclado y visualizarlo

  
ejemplo 3  
Ejemplo 3. Visualiza    por pantalla el nombre introducido por teclado
  
En muchas    ocasiones será de gran utilidad recoger un dato por teclado y guardarlo para    posteriormente tomar decisiones según lo que se haya introducido (muy útil por    ejemplo para los accesos de los usuarios a las páginas). En este ejemplo, la    variable que definimos, nom nos    servirá para guardar lo que introduzcamos por teclado a través de la función prompt de Javascript.
  

Pedir    confirmación para visitar una página

  
ejemplo 4
  
  Ejemplo 4.   Ejemplo que    pide confirmación para visitar una página.
  
En algunas páginas Webs cuando accedemos    a ellas nos piden que confirmemos que somos mayores de edad para que podamos    entrar en ellas. Esta confirmación lo podemos hacer con Javascript. La función confirm visualiza una ventana emergente    de confirmación (con el texto que le indiquemos) cuyas opciones que nos da son    Aceptar o Cancelar dicha confirmación. Devolverá dicha función un “trae” (si    pulsamos Aceptar) o un “false” (si pulsamos Cancelar) y en el ejemplo solamente    visitaremos la página oficial de la saga tan famosa de Star Wars cuando al    pulsar sobre el enlace hayamos pulsado Aceptar.
  

Abrir    una ventana pop-up cada cierto tiempo

  
ejemplo 5
  
  Ejemplo 5. Ejemplo que    abre una ventana emergente cada 3 segundos. Pulsando el botón no se abren más.
  
A    continuación mostramos un ejemplo de cómo abrir ventanas emergentes (o también    llamadas pop-up) cada cierto tiempo automáticamente. Este ejemplo es muy útil    para abrir ventanas de publicidad aparte de la principal.
  
En el    ejemplo se define un intervalo de ejecución en Javascript con la función setInterval que lo que hará es ejecutar    la función abrir_ventana() cada 3 segundos (3000 milisegundos). La función    abrir_ventana() contiene la función window.open que lo que hará es abrir una nueva página conteniendo la web del Ministerio de    Educación. Al pulsar sobre el botón se ejecutará el código Javascript clearTimeout que detendrá el intervalo    de ejecución de abrir ventanas continuamente.
 
  

Visualizar    un reloj digital en la página web

  
ejemplo 6
    
  Ejemplo 6.   Ejemplo que    visualiza un reloj digital.
  
Este ejemplo es muy útil para    visualizar en una página html un reloj dígital que se va actualizando cada 500    milisegundos. Como se puede apreciar,  se    crea un intervalo de ejecución de 500 milisegundos de la función “Ver_Hora.” Ver_Hora()    recoge la hora, la formatea con la representación hh:mm:ss (hora, minutos,    segundos) y la visualiza dentro del objeto del html, identificado con el nombre    de “mireloj”. Dicho objeto, se    encuentra dentro del documento de    html, a su vez en el único formulario   FORM existente y definitivamente en un botón en forma de texto  INPUT.
  
Es por esto que al    referenciarlo para escribir en él la hora Javascript lo haga de la siguiente forma:
document.forms[0].mireloj.value
    
Si hubiera otro formulario en la página que lo contuviera sería de la    siguiente manera:
document.forms[0].mireloj.value
  
Esto es lo que se denomina    anidamiento de objetos (dentro de unos hay otros).
  

Crear una galería de imágenes

  
ejemplo 7
  
Ejemplo 7. Ejemplo que    muestra una galería de imágenes.
  
Este es un    ejemplo práctico de cómo crear una galería de imágenes con Javascript.
  
Tenemos una    etiqueta <img> en html denominada también con el nombre “img” que iremos cambiando, según lo que elijamos    dentro del formulario imágenes en las    opciones de selección <select> llamados conjuntamente imagen.
  
Al cambiar (onChange) de selección, se ejecutará la    función ver_imagen() que cargará en    el objeto llamado img ( document.images.img.src)      el contenido del valor (value, en      este caso contienen ficheros de imágenes – 1.jpg,2.jpg…) de la opción que en      ese momento hayamos seleccionado (document.imagenes.imagen.selectedIndex)  del objeto imagen:
  
  document.imagenes.imagen.options[document.imagenes.imagen.selectedIndex].value  
  
  
  

Deshabilitar    el botón derecho del ratón

  
ejemplo 8
  
Ejemplo 8. Ejemplo que    deshabilita el botón derecho del ratón.
  
Al pulsar    con el botón derecho del ratón sobre una página Web podríamos seleccionar    cualquier gráfico o texto que contuviera este y guardarlo en nuestro ordenador.    Es posible que los diseñadores de dichas páginas sean muy reticentes a esto.    Deshabilitando el botón derecho se solucionaría, aunque hay que decir que por    otros medios (más complejos), se conseguiría igualmente guardar el contenido,    aún así esta es una buena y rápida solución para aquellos usuarios menos    avanzados.
  
Hay que    tener en cuenta que el script hace diferencia entre los navegadores de Netscape    e Internet Explorer ya que estos tratan de forma diferente los eventos de    pulsar los botones del ratón.
  
Básicamente    este script, cuando se pulsa un botón del ratón (document.onmousedown o window.onmousedown) lo que hace es ejecutar la función boton_derecho() que a su vez, lo que    hace, es comprobar si se ha pulsado el derecho (ejemplo event.button == 2 || event.button    == 3) y entonces lo que genera es    visualizar una alerta.
  

Imprimir    una página Web

  
ejemplo 9  
  
Ejemplo 9. Ejemplo que  al pulsar un botón se imprime la página Web.
  
Este ejemplo    es tan sencillo como práctico. Con Javascript también podemos imprimir una    página Web. Simplemente ejecutando la función "window.print()" se    imprimirá todo el contenido de la página actual.
  
En este    caso, hemos incluido un botón INPUT que al pulsarlo (onClick) se realiza    la acción de imprimir la página.
  
Este ejemplo    es muy útil para incluir en páginas que no incluyen las barras típicas del    explorador (por decisión del diseñador) y que por lo tanto en ellas no se puede    ejecutar la opción típica de Archivoà Imprimir… propia del Navegador. De esta forma se podría meter un botón que imprimiera    el contenido de dicha página tal como muestra el ejemplo.
  
     ¿Sabias que…?
     Java y      Javascript son dos lenguajes totalmente diferentes, que solo tienen en común la      primera parte del nombre. Además de que Java fue creado por Sun Microsystems      (Javascript por Netscape) dicho lenguaje es más general, pudiéndose realizar      grandes aplicaciones de gestión para empresas.
  
 
  

Mostrar    mensajes en movimiento en la barra de estado del navegador

  
ejemplo10
  
Ejemplo 10. Ejemplo que    muestra un mensaje en movimiento en la barra de estado del navegador.
  
Cuando    se accede a una página Web cualquier método es válido para captar la atención    del usuario.
  
En    algunas ocasiones te habrás fijado que emergen mensajes que se van moviendo en    la barra de estado del navegador, la que está justamente debajo de la página    que se ve. Esto recurso es muy útil para captar rápidamente la atención del    usuario y principalmente sirven para mostrar mensajes cortos que se usan para    dar alguna información especifica de la página (cual es el tema principal de la    página, algún enlace de interés dentro de la página, etc). El código Javascript que se presenta aunque pueda parecer muy complejo en    realidad no lo es.
  
Pasemos a explicarlo.
  
Cuando se carga la    página (onLoad) se ejecuta la función scroll_start() que lo que hace, en    primer lugar, es definir el texto a escribir en la barra. Después, realiza un    truquillo. Añade al mensaje 100 caracteres en blanco. La razón a esto es que si    no lo hacemos, el mensaje se ajustará totalmente a la izquierda de la barra y    no se podrá ver con claridad. De esta forma, le estamos diciendo que al añadir    unos caracteres en blanco, deje la parte izquierda de la barra “libre” para    visualizar el texto (si no ves clara la explicación prueba a comentar las líneas    de código de la siguiente forma -añadiendo los caracteres // al principio de cualquier linea Javascript el Navegador no    ejecutará dicha línea- y entenderás mejor) :
    
   // for (i=0;i<space;i++)    


   // msg=" "+msg;    
  
Después se ejecuta    continuamente la función scrollmsg(pos), a    través de un intervalo de ejecución (setTimeOut es muy parecida a setInterval con la diferencia que se ejecuta solo una vez, es por lo que como se ve hay que    volver a ejecutarla cada vez), que lo que hará es visualizar en la barra de    estado el substring que se obtenga de la posición pos de la cadena a visualizar hasta el final de la misma. Así de    esta forma se consigue el efecto scroll deseado.
  

Crear un correo electrónico

  
ejemplo 11
  
  Ejemplo 11.   Ejemplo que construye un correo electrónico para ser mandado.
  
Un ejemplo    muy práctico. Podemos construir un correo electrónico en Javascript simplemente    generando un string con la estructura siguiente:
  
  mailto:correo@destino?subject=Asunto    del correo&body=Cuerpo
  
Y después    asignar a la siguiente función de Javascript location.href el string que hubiésemos    construido. Al ejecutar esto último, se abrirá nuestro gestor de correo    predeterminado con el correo que quisiésemos mandar, ya totalmente completado y    listo para ser enviado.

TOMADO DE: http://recursostic.educacion.es/observatorio/web/gl/software/programacion/490-lorena-arranz

martes, 21 de junio de 2016

JAVASCRIPT

¿Dónde puedo ver funcionando JavaScript?

Entre los diferentes servicios que se encuentran realizados con Javascript en Internet se encuentran:
  • Correo
  • Chat
  • Buscadores de Información
  • También podemos encontrar o crear códigos para insertarlos en las páginas como:
  • Reloj
  • Contadores de visitas
  • Fechas
  • Calculadoras
  • Validadores de formularios
  • Detectores de navegadores e idiomas

¿Cómo identificar código JavaScript?

El código javascript podemos encontrarlo dentro de las etiquetas <body></body> de nuestras páginas web. Por lo general se insertan entre: <script></script>. También pueden estar ubicados en ficheros externos usando:
<script type="text/javascript" src="micodigo.js"></script>

Algunas características del lenguaje son:

Su sintaxis es similar a la usada en Java y C, al ser un lenguaje del lado del cliente este es interpretado por el navegador, no se necesita tener instalado ningún Framework.
  • Variables: var = “Hola”, n=103
  • Condiciones: if(i<10){ … }
  • Ciclos: for(i; i<10; i++){ … }
  • Arreglos: var miArreglo = new Array(“12”, “77”, “5”)
  • Funciones: Ppopias del lenguaje y predefinidas por los usuarios
  • Comentarios para una sola línea: // Comentarios
  • Comentarios para varias lineas:
    /*
    Comentarios
    */
  • Permite la programación orientada a objetos: document.write("Hola");
  • Las variables pueden ser definidas como: string, integer, flota, bolean simplemente utilizando “var”. Podemos usar “+” para concatenar cadenas y variables.

¿Es compatible con navegadores?

Javascript es soportado por la mayoría de los navegadores como Internet Explorer, Netscape, Opera, Mozilla Firefox, entre otros.
Con el surgimiento de lenguajes como PHP del lado del servidor y Javascript del lado del cliente, surgió Ajax en acrónimo de (Asynchronous Javascript And XML). El mismo es una técnica para crear aplicaciones web interactivas. Este lenguaje combina varias tecnologías:
  • HTML y Hojas de Estilos CSS para generar estilos.
  • Implementaciones ECMAScript, uno de ellos es el lenguaje Javascript.
  • XMLHttpRequest es una de las funciones más importantes que incluye, que permite intercambiar datos asincrónicamente con el servidor web, puede ser mediante PHP, ASP, entre otros.
Debemos tener en cuenta que aunque Javascript sea soportado en gran cantidad de navegadores nuestros usuarios pueden elegir la opción de Activar/Desactivar el Javascript en los mismos.

 


martes, 14 de junio de 2016

JAVASCRIPT

JavaScript es un lenguaje de programación, al igual que PHP, si bien tiene diferencias importantes con éste. JavaScript se utiliza principalmente del lado del cliente (es decir, se ejecuta en nuestro ordenador, no en el servidor) permitiendo crear efectos atractivos y dinámicos en las páginas web. Los navegadores modernos interpretan el código JavaScript integrado en las páginas web.
 
Para entender lo que es JavaScript consideremos lo siguiente. Un usuario escribe una dirección web en su navegador, por ejemplo http://www.aprenderaprogramar.com. El servidor recibe la petición y como respuesta a esa petición envía al ordenador del usuario código HTML junto a código JavaScript. El código HTML se encarga de que en la pantalla se muestre algo, por ejemplo una imagen, un menú, etc. El código JavaScript se puede encargar de crear efectos dinámicos en respuesta a acciones del usuario, por ejemplo que se despliegue un menú tipo acordeón cuando el usuario pasa el ratón por encima de un elemento del menú.
La ventaja de JavaScript es que al estar alojado en el ordenador del usuario los efectos son muy rápidos y dinámicos. Al ser un lenguaje de programación permite toda la potencia de la programación como uso de variables, condicionales, bucles, etc. También podemos citar algún inconveniente: por ejemplo si el usuario tiene desactivado JavaScript en su navegador, no se mostrarán los efectos. No obstante, hoy día la mayoría de los usuarios navegan por la web con JavaScript activado.
 
 
FORMAS DE USAR JAVASCRIPT EN DOCUMENTOS HTML
La primera forma de usar JavaScript dentro de una página web es embebiendo directamente el código JavaScript dentro del código HTML. Vamos a poner un ejemplo de código JavaScript pero no vamos a entrar en detalle a comentarlo ni explicarlo ya que en este curso no vamos a explicar JavaScript. Simplemente queremos saber interpretar por qué dentro de un documento HTML pueden aparecer fragmentos de código escrito en otro lenguaje.
 
Ejemplo:
<html>
<head>
<title>Embeber JavaScript – aprenderaprogramar.com</title>
</head>
<body>
<script type="text/javascript">
document.write('Hola Mundo');
</script>
</body>
</html>
 
 
Como podemos observar, el código JavaScript debe ir encerrado entre las siguientes marcas:
<script type="text/javascript">
</script>
 
La segunda forma para usar JavaScript es definir JavaScript en un archivo externo. Los archivos de JavaScript son archivos de texto guardados con la extensión .js. Veamos un ejemplo: imaginemos que tenemos un archivo denominado mensaje.js con código JavaScript:
alert('Mensaje JavaScript');
 
Ahora, para incluir dicho archivo en la una página web utilizaríamos el siguiente código:
<script type="text/javascript" src="archivo.js"></script>
 
Este código se escribiría dentro de las etiquetas <head> y </head> del documento HTML en el que vayamos a insertarlo
<html>
<head>
<meta charset="utf-8">
<title>Embeber JavaScript – aprenderaprogramar.com</title>
<script type="text/javascript" src="archivo.js"></script>
</head>
<body>
Página web de prueba – aprenderaprogramar.com
</body>
</html>
 
NOTA: Tal y como hemos pues la ruta, el archivo.js debe estar en el mismo directorio que el fichero HTML. Si estuviera en otro directorio, habría que especificar la ruta.
Los resultados los vemos al cargar el documento html en nuestro navegador y serán similares a lo que vemos en las siguientes imágenes.
 
 
Al cargar el documento HTML se incorpora el código JavaScript desde el archivo incrustado, que da lugar a que se muestre una ventana con el aviso “Mensaje JavaScript”. Cuando pulsemos sobre el botón aceptar, veremos el contenido del documento HTML:
 
 
Los ejemplos anteriores son muy simples, pero usando JavaScript avanzado podemos crear funciones interactivas en nuestra página web, como por ejemplo una calculadora.
 
 
En el ejemplo que hemos puesto, gracias a JavaScript el usuario podría introducir un peso (weight), los kilates (karats) y al pulsar el botón = obtener el valor. Con JavaScript se pueden realizar numerosas funciones que no se pueden realizar con HTML.
Otro lenguaje que se relaciona con HTML es PHP, si bien PHP no se ejecuta en nuestro ordenador sino en el servidor.
 
 
RESUMEN
Los documentos HTML permiten incrustar fragmentos de código JavaScript, bien dentro del propio archivo HTML o bien realizando una carga de ese código indicando el archivo donde se encuentra el código JavaScript. Dentro de un documento HTML puede haber ninguno, uno o varios scripts de JavaScript. El uso de JavaScript es muy habitual en la programación web. En este curso no entramos a explicar el lenguaje de programación JavaScript, pero hemos considerado adecuado dejar indicado que JavaScript es un lenguaje que la mayor parte de los programadores web conocen porque permite hacer muchas cosas que no se pueden hacer con HTML. Si quieres profundizar en la programación web te recomendamos que después del curso de HTML realices los cursos de CSS y JavaScript de aprenderaprogramar.com.
 

martes, 7 de junio de 2016

ENTREGA DE DEFINITVAS.(CLASE N°18)

En esta clase se hizo entrega de definitivas. Además nos indico el tema a tratar el siguiente bimestre que es: JavaScript, al igual que nos recordó las pautas a seguir para tener un gran desempeño en el tercer bimestre.

martes, 31 de mayo de 2016

ACUMULATIVO SEGUNDO BIMESTRE. (CLASE N°17)

En esta clase realizamos el acumulativo del segundo bimestre:
-Oral
-Con apuntes
-Grupal (Nota individual)
Quede exenta sin embargo estuve en sala escuchando las preguntas y respuestas de mis compañeros.

martes, 24 de mayo de 2016

EVALUACION.(CLASE N°16)

En esta clase evaluamos dos indicadores,en mi caso quede exenta sin embargo el profesor Nelson nos indico el ejercicio para hacerlo fuera de la sala de informatica.