VARIAS FORMAS DE INCLUIR CÓDIGO JAVASCRIPT EN PÁGINAS WEB. > TECNOLOSFERA! Aprendiendo Juntos.
  • TECNOLOSFERA-Mortal-Kombat
  • TECNOLOSFERA-ZOMBIES
  • TECNOLOSFERA-TELEFONOMOVIL-CHINO
  • TECNOLOSFERA-SMARTPHONE
  • TECNOLSFERA-APPLE

Novedad.

Posted by TECNOLOSFERA! Unknown
TECNOLOSFERA-JAVASCRIPT

Existen varias formas de incluir código JavaScript en documentos html lo cuál permite flexibilidad para su modificación.

1.La primera forma de incluir código JavaScript en un documento html es de forma directa, o lo que quiere decir en el mismo documento.Esta forma utiliza las etiquetas (Tags) en este caso utilizaremos la etiqueta : <script> y se puede introducir en cualquier parte del documento, sin embargo lo aconsejable es que este se incluya en la cabecera del documento dentro de la etiqueta <head>.


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>TECNOLOSFERA ejemplo de inclusión de javascript en el documento html</title>
<script type="text/javascript">
alert("Mensaje de aprendizaje"); <---"Código  JavaScript"</script>
</head>   <body> <p>Párrafo cualquiera.</p> </body> </html>
Esta forma de incluir código JavaScript se emplea para indicar modificaciones o soluciones específicas en un documento html permitiendo trabajar directamente en el.
A la etiqueta <script> es necesario aplicar el atributo type para su correcto reconocimento con su respectivo valor "text/javascript".
El problema de este tipo de inclusión es que si se desea cambiar el código es necesario hacerlo para todas las páginas web en ese mismo bloque de código.

2.La segunda forma de incluir código JavaScript en un documento html es en un archivo externo, enlazando mediante la etiqueta <script>. La flexibilidad de este código permite crear documentos como sean necesarios y la capacidad de el documento html permite igualmente enlazar archivos JavaScript como se requiera.

Archivo codigo.js
alert("Mensaje de aprendizaje");
Documento XHTML
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>TECNOLOSFERA ejemplo de inclusión javascript en archivo externo</title>

<script type="text/javascript" src="/js/codigo.js"></script> <--código javascript"
</head>
 
<body>
<p>párrafo de texto.</p>
</body>
</html>
Esta forma de enlazar código requiere de otro atributo aparte de el atributo type , es el caso de el atributo src que indica la URL o ubicación de el archivo JavaScript que se quiere enlazar.La etiqueta <script> puede enlazar sólo un archivo pero se pueden incluir tantas etiquetas <script> como se necesiten.

El archivo javascript externo es un archivo de texto con la extensión .js. La principal característica de utilizar esta forma de inclusión es que se puede ahorrar mucho tiempo debido a que se reutiliza el código y si se realiza una modificación en cualquiera de las páginas con el mismo código, está se reproduce en todas la páginas web que son enlazadas, una manera sencilla de hacer de realizar una sola acción para aplicarlas a las demás páginas.

3.La tercera forma de incluir código javascript es incluirla directamente en los elementos de html.Este método no es muy empleado por los programadores pues utiliza pequeños fragmentos de código javascript incluidos en los elementos de html.
Esta forma de manejar el código se utiliza generalmente en casos especiales pues se tiende a confundir porque suele causar daños en la organización de el código y dificulta el mantenimiento posterior de este.
Por lo general se realiza para la ejecución de eventos como es el caso de "onclick".


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
<title>TECNOLOSFERA inclusión de javascript en los elementos xhtml</title>
</head>
 
<body>
<p onclick="alert('Mensaje de prueba')">Párrafo de texto.</p>
</body>
</html>

En la siguiente lección : La etiqueta <noscript>.
tecnolosfera_ultimos_productos tecnolosfera_mas_productos tecnolosfera_home

0 comentarios:

Publicar un comentario

Translate

Formulario de contacto.

Nombre

Correo electrónico *

Mensaje *