Javascript: Acoplamiento

Javascript: Acoplamiento

Print Friendly, PDF & Email
Javascript: Acoplamiento
Valora esta entrada
En entradas anteriores hemos visto el origen de javascript como una de las aportaciones de Netscape a la web y como un lenguaje muy útil para aprender a programar.

Este lenguaje de script nos permite modificar la estructura, el contenido, los estilos de las etiquetas html de un documento web y añadir dinamismo a una página.

Existen varios métodos para acoplar el javascript en un proyecto web:

  1. En el <head> dentro de las etiquetas <script></script>
  2. En el <body> dentro de las etiquetas <script></script>
  3. En la consola del navegador mediante la instrucción console.log(“mensaje”) o escribiendo el código javascript directamente dentro de la consola.
  4. En una hoja .js externa llamada mediante la instrucción <script src=”aquí la url de la hoja .js”></script>
  5. Como atributo de una etiqueta html. Por ejemplo un <button>
Acoplamiento de javascript en un documento xhtml
javascript por pantalla

Atención: Si lo estás mirando desde un teléfono, algunos navegadores como Opera mini no tienen soporte para Javascript o incluso en Chrome podemos encontrar la opción deshabilitada la opción por defecto. Para habilitarlo te recomiendo este enlace explicativo.

Para ver el texto por la consola del navegador, tras hacer click en el botón tienes que ir a “más herramientas > herramientas para desarrolladores > consola“.

No escribiremos HTML ni Javacript entre:

  • La etiqueta de cierre </head> y la apertura del <body>
  • La etiqueta de cierre </body> y </html>
  • Dentro de <script src=”llamada a una hoja .js”> aquí no escribiríamos </script> cuando la etiqueta <script> hace una llamada a una hoja externa en el atributo
Actualización 25 de enero

Escribir todo el JS en una misma hoja externa

Ayer nos quedó este ejercicio un poco incompleto… vamos a ver si hoy le ponemos el lazo al concepto de acoplamiento en Javascript.

El siguiente paso sería dejar la hoja un poco bonita. No tiene ningún sentido declarar varios scripts en una misma hoja. Y además a los programadores les gusta ser muy ordenados. El html en el documento web, el css en una hoja separada y para el JS también un lugar a parte.

Para hacerlo bien reuniremos todo el código en la hoja que hemos nombrado funciones.js (dentro de la carpeta js). A excepción del botón, claro. Tener en cuenta que en este caso se trata de un atributo de una etiqueta html y que no lo podemos quitar así como así. En realidad si se puede, pero asignando una propiedad al botón durante la fase de carga del documento y interactuando con el DOM. Es pronto para esto…. llegaré de aquí a bastantes días.

El ejercicio a realizar sería pues “acoplar” todo el javascript posible fuera del documento html y dejar la hoja lo más limpia posible.

Si lo hacéis… el resultado será algo similar a la captura que se muestra. Os dejo que os esforcéis un poco y ya me diréis 😉

resultado tras aglutinar todo el JS en una hoja externa
Resultado tras aglutinar todo el JS en una hoja externa

¡Y hasta aquí el resumen de hoy y de una parte día siguiente 😉

¡Espero que os sea útil y vuestro feedback en los comentarios!

Entradas relacionadas:

Ejercicio – Corrige los errores (concepto acoplamiento javascript)
- 101
Ejercicio javascript en el que se repasa el concepto de acoplamiento y se piden corregir algunos errores típicos.
3 formas de cambiar la ubicación de búsqueda en Google
- 144
En esta entrada encontrarás 3 formas distintas de modificar tu ubicación de búsqueda en google sin necesidad de que te tengas que desplazar.
Como añadir nuevos nodos al DOM usando Javascript
- 350
En esta entrada vemos un tutorial paso a paso sobre como añadir nuevos nodos al DOM mediante Javacript con el ejemplo de un párrafo y el de una imagen.
Ejercicio – Cálculo del perímetro de un rectángulo mediante funciones
- 87
Ejercicio en el que se práctica de modo fácil la lógica de programación mediante el uso de funciones declaradas en JS.
Instrucciones básicas para familiarizarse con javascript
- 381
El javascript es un lenguaje que se olvida a una velocidad de vértigo si no se practica. Es importante tener unos buenos apuntes 😉 Hoy presento instrucciones básicas que sirven para empezar con scrip...
Ejercicio – Acoplamiento de javascript en un documento web
- 142
Ejercicio y solución de un problema introductorio al mundo del Javascript.
Palabras reservadas que no se deben usar para declarar variables
- 167
Listado de palabras reservadas en Javascript de acuerdo con el último stándard ECMA Script 6.
Ejercicio – ¿Estamos en fin de semana?
- 83
Ejercicio dónde se resuelve un simple ejercicio mediante el uso de getDay() y se compara un switch y un if. Incluye solución.
Ejercicio JS – Crear un cronómetro con javascript
- 36
Completo cronómetro JS dónde se usa setInterval, addEventListener, removeEventListener y se repasan conceptos de CSS. Incluye solución.
Ejercicio – ¿En qué día de la semana estamos?
- 67
Problema javascript que devuelve en formato texto el día de la semana en el que esamos. Incluye 2 posibles soluciones con switch() y array.
Francesc Ricart
hola@francescricart.com

Soy un ingeniero industrial a quién le apasiona aprender y enseñar. En el mundo del marketing online he encontrado una de mis pasiones. Ejerzo como docente ocupacional y privado para empresas. Y también hago consultoría web para PIMES, autónomos y otros emprendedores como yo. Ayudo a las empresas en cualquier temática relacionada con su presencia digital y herramientas web. Aunque mi especialidad es el posicionamiento en buscadores (SEO). A nivel de formación lo que más feliz me hace es que un alumno haga de mi pasión una forma de vida y le ayude a encontrar trabajo. A nivel de negocios ayudo a empresarios a desenvolverse con soltura en el mundo digital y les animo a hacer cada vez más cosas que nunca hubieran imaginado que ellos también podían hacer. En este camino les ayudo haciendo todo aquello dónde ellos no llegan y crecemos juntos. Encontraréis más acerca de mi en la página sobre mi

2 Comentarios
  • Irene
    Publicado a las 14:01h, 04 julio Responder

    en este mes de julio me lo vuelvo a mirar 🙂 a ver si tengo mas suerte y consigo los estudios!

    todo bien o que? espero que si ^^

    un abraaaaaaaaaaaazo y gracias,por que lejos de desanimarte como hacen la mayoría de profesores, tu motivas

  • Francesc Ricart
    Publicado a las 08:58h, 05 julio Responder

    hola irene!
    una alegría verte por aquí!! 🙂
    nunca es tarde!! ¡¡muchísimo ánimo y si tienes dudas para eso estamos!!

Escribir un comentario

  Acepto la política de privacidad

Responsable: FRANCESC RICART MUÑOZ.

Finalidad: Gestionar los comentarios que realizas en este blog.

Destinatarios: No se cederán datos a terceros, salvo obligación legal.

Derechos: Tienes derecho a acceder, rectificar y suprimir los datos, así como otros derechos, como se explica en la política de privacidad.