Diferencia entre revisiones de «Usuario:Juanda/javascript/Introducción»

De WikiEducator
Saltar a: navegación, buscar
Línea 64: Línea 64:
 
</source>  
 
</source>  
 
</div>
 
</div>
 +
<div class="slide">
  
 
===Colocación del JavaScript===
 
===Colocación del JavaScript===
Línea 75: Línea 76:
 
...
 
...
 
</html>
 
</html>
−
:.Ejecución mediante llamada, al “disparar” (trigger) un evento.
+
*Ejecución mediante llamada, al “disparar” (trigger) un evento.
−
:.Ejecución previa a la renderización del del body
+
*Ejecución previa a la renderización del del body
  
 +
</div>
 +
<div class="slide">
 +
<source lang="html4strict">
 +
<html>
 +
<head>
 +
</head>
 +
<body>
 +
<script type="text/javascript">
 +
....
 +
</script>
 +
</body>
 +
</html>
 +
</source>
 +
* Ejecución: Al cargar la página (generará contenido de la página)
  
 +
</div>
 +
<div class="slide">
  
 +
<source lang="html4strict">
 +
<html>
 +
<head>
 +
<script type="text/javascript" src="xxx.js"></script>
 +
</head>
 +
<body>
 +
</body>
 +
</html>
 +
</source>
 +
 +
JavaScript en un fichero separado:
 +
 +
*Para ahorrar código si se van a ejecutar los mismos scripts en varias páginas html.
 +
*El script de JavaScript externo debe tener extensión .js
 +
</div>
 +
<div class="slide">
 +
 +
<source lang="html4strict">
 +
<html>
 +
<head>
 +
</head>
 +
<body>
 +
<p onclick=”funcion();">
 +
Ejemplo de Javascript
 +
</p>
 +
</body>
 +
</html>
 +
</source>
 +
JavaScript en los propios elementos del html
  
 +
* Ensucia el código xhtml y complica el mantenimiento del javascript
 +
* Solo lo utilizaremos aquí para algunos casos especiales
 +
</div>
  
  
  
 
</div>
 
</div>

Revisión de 10:17 21 sep 2012

Introducción

Qué es JavaScript

  • Es EL LENGUAJE de scripts en la Web
  • Es un lenguaje de scripts, interpretado (no se compila, lo interpreta directamente el navegador), sin coste por licencia.
  • Se inserta directamente en las páginas html.
  • No tiene nada que ver con Java. Java es un lenguaje mucho más complejo y potente.
  • Requiere tener un conocimiento previo de HTML / XHTML

Para que sirve JavaScript

  • Herramienta de programación (sentencias condicionales, bucles...)
  • Inserción de texto dinámico en una página HTML: 
	document.write("<h1>" + name + "</h1>")
  • Puede reaccionar a eventos: Página que termina de cargar, click en un elemento HTML, etc.
  • Lee y escribe elementos HTML
  • Validación de datos en formularios (ahorra procesamiento al servidor y agiliza la respuesta a errores para el usuario).
  • Detección del navegador del usuario
  • Creación de cookies

Etiquetas de JavaScript en el código html

<html>
	<body>
		<script type="text/javascript">
			<!--
				document.write("¡Hola Mundo!");
			//-->
		</script>
	</body>
</html>
  • Etiquetas de JavaScript: 
<script type="text/javascript"> </script>
  • Comentario en html (para que el navegador no muestre el javascript como texto si no lo sabe ejecutar). ¡Se debe poner para hacer validación W3C! 
<!--  -->
  • Comentario en JavaScript, útil en el ejemplo anterior, para que no se interprete dentro del JavaScript la marca de comentario de html: 
	// Comentario en JavaScript
  • Método write del objeto document para escribir en la página web: 
	document.write

Colocación del JavaScript

<html>
	<head>
		<script type="text/javascript">
			....
		</script>
	</head>
...
</html>
*Ejecución mediante llamada, al “disparar” (trigger) un evento.
*Ejecución previa a la renderización del del body
 
</div>
<div class="slide">
<source lang="html4strict">
<html>
	<head>
	</head>
	<body>
		<script type="text/javascript">
			....
		</script>
	</body>
</html>
  • Ejecución: Al cargar la página (generará contenido de la página) 
<html>
	<head>
		<script type="text/javascript" src="xxx.js"></script>
	</head>
	<body>
	</body>
</html>

JavaScript en un fichero separado:

  • Para ahorrar código si se van a ejecutar los mismos scripts en varias páginas html.
  • El script de JavaScript externo debe tener extensión .js 
<html>
	<head>
	</head>
	<body>
		<p onclick=”funcion();">
			Ejemplo de Javascript
		</p>
	</body>
</html>

JavaScript en los propios elementos del html

  • Ensucia el código xhtml y complica el mantenimiento del javascript
  • Solo lo utilizaremos aquí para algunos casos especiales


Obtenido de «https://es.wikieducator.org/index.php?title=Usuario:Juanda/javascript/Introducción&oldid=8937»