Iniciar sesión
Crear cuenta
Crear cuentaCrear cuentaGUÍA PRACTICA DE JAVASCRIPT
4- Cómo ver el código de una página y reutilizarloUna de las mejores cosas que tiene JavaScript es la posibilidad de sacar los scripts que están funcionando en una página web y adecuarlos a nuestro site. Para eso, primero tendrías que saber como ver el código de la pagina web. Es muy fácil: cargando la dirección deseada, te posicionás con el mouse por el navegador sin estar posado sobre una foto o un link y tocas el botón derecho.
Dependiendo del navegador que tengas, tendrías que presionar "View Source", "Show Code", "Mostrar el Código" o "Ver Código" para que se te abra el Notepad con el código fuente.
Luego, localizando las etiquetas antes mencionadas podemos ir sacando los scripts <script languaje = "javascript"> hasta </script> y pegarlos en tu documento en el mismo lugar donde lo encontraste, dentro del <body> o dentro del <head>.
Hay que tener en cuenta que no solo hay que sacar los scripts que estén contenidos dentro del tag antes mencionado. También, como vimos en el ejemplo, hay que extraer el código JavaScript que esté dentro de las imágenes y links, o de cualquier evento que veamos dentro del HTML.
Por ejemplo, los que están en las fotos, como este:
Ejemplo 1: Presionen aquí para ver el ejemplo
En el primer ejemplo podemos ver que en medio de las etiquetas <script> tenemos una instrucción Javascript "document.write("texto")". Esto lo que hace es imprimir texto dentro del HTML. Mas adelante nos va a servir para agregar condiciones y que escriba alguna palabra dependiendo de ese requisito.
Abajo hay un link con una instrucción en el 'alert("texto")'. Esta abrirá una pequeña pantalla con el texto que nosotros queramos poner.
Ejemplo 2: Presionen aquí para ver el ejemplo
<html>
Este segundo ejemplo es una página que al iniciarse muestra un cartel diciendo "Presioná el boton". Esta instrucción se va a ejecutar apenas se cargue la pagina porque está puesta dentro de la etiqueta <body> con el evento onload (Cuando cargue).
Después tenemos un script igual al del ejemplo 1 que simplemente escribe un texto. Bajando un poco, vemos un botón que al ser presionado va a modificar la barra de status. Sintaxis de status:
Ejemplo 3: Presionen aquí para ver el ejemplo
Este último ejemplo es un poco más complicado. En primer lugar repite lo del anterior mostrando un cartel al cargar la página. Después imprimimos un texto con "document.write".
Algunas líneas mas abajo se abre un formulario con el evento "onsubmit", este se va a correr cuando apretemos el botón de submit, que seríaa el botón "Ver". Al clickear el texto que escribimos en el textbox, se ejecuta la función alert que tiene una concatenación (unión de caracteres) de la palabra "Hola", luego está el símbolo + que usamos para unir palabras, seguido por una escalera de nombres que llegan al valor del textbox.
Si nos fijamos en esta instrucción vemos que es muy fácil: "window.document.nombreform.nombretext.value". Primero llamamos a la ventana donde estamos (window) después al documento (document) mas tarde al formulario (nombreform) y finalmente al textbox(nombretext). Ahora al método del textbox "values" y ya tenemos el valor incorporado.
Este trabajo ha sido realizado por Tomás Rawski
<img scr="hola.gif" onclick="llamarafuncion();">
Todo lo que está después de "onclick" lo vamos a tener que llevar a nuestra página ya que indica cuando se llama a determinado proceso. En este caso cuando se presione sobre la foto, se va a ejecutar la función "llamarafuncion".
<html>
<head>
<title>Ejemplo 1</title>
</head>
<body>
<script languaje="Javascript">
<!--
document.write ("Este es el tutorial de javascript");
//-- >
</script>
<br>
<a href="javascript:alert('Este es el tutorial de javascript')">Presióname</a>
</body>
</html>
<head>
<title>Ejemplo 2</title>
</head>
<body onload="alert('Presiona el boton');">
<script languaje="Javascript">
<!--
document.write ("Este es el segundo Ejemplo");
//-- >
</script>
<br>
<input type="button" value="Toca acá" onclick="window.status = 'Mira donde podes escribir ! ! ! ! ! ! ! !';">
</body>
</html>
window.status = mensaje
El mensaje puede ser una variable, una concatenación de caracteres o simplemente un texto.
<html>
<head>
<title>Ejemplo 3</title>
</head>
<body onload="alert('Escribi el nombre en el Text Box');">
<script languaje="Javascript">
<!--
document.write ('Este es el tercer Ejemplo');
//-->
</script>
<br>
<form name="nombreform" onsubmit="alert('Hola '+window.document.nombreform.nombretext.value)">
Nombre<input type="text" name="nombretext">
<input type="submit" value="Ver">
</form>
</body>
</html>
1-Como hacer sitios interactivos
2-Java y JavaScript: Parecidos pero diferentes
3- Cómo insertar código JavaScript
4- Cómo ver el código de una página y reutilizarlo