JavaScript es uno de los lenguajes de programación interpretados , ligeros y compilados más populares . Es síncrono y de un solo subproceso. Los programas en JavaScript se denominan scripts y se ejecutan como textos sin formato. Podemos escribir estos scripts directamente en nuestra página HTML o usar un archivo JavaScript externo. JavaScript puede ejecutarse en el navegador, y también en el servidor, o en realidad en cualquier dispositivo que tenga un programa especial llamado motor JavaScript . JavaScript se utiliza tanto para desarrollos del lado del servidor como del lado del cliente.
Hay 2 formas de usar javascript en el archivo HTML:
- JavaScript interno : JavaScript se puede agregar directamente al archivo HTML escribiendo el código dentro de la etiqueta <script>. Podemos colocar la etiqueta <script> dentro de <head> o la etiqueta <body> según la necesidad.
- JavaScript externo : la otra forma es escribir código JavaScript en otro archivo que tenga una extensión .js y luego vincular el archivo dentro de la etiqueta <head> o <body> del archivo HTML en el que queremos agregar este código.
Ejemplo: Este ejemplo describe el uso de Javascript interno.
HTML
<!DOCTYPE html>
<html>
<head>
<title>Internal JS</title>
</head>
<body>
<h2>GeeksforGeeks</h2>
<script>
/*Internal Javascript*/
console.log("Hi Geeks, Welcome to GfG");
</script>
</body>
</html>
Salida :
Hi Geeks, Welcome to GfG
Ejemplo: Este ejemplo describe el uso de Javascript externo.
HTML
<!DOCTYPE html> <html> <head> <title>External JS</title> </head> <body> <h2>GeeksforGeeks</h2> <script src="GfG.js"></script> /* External Javascript */ </body> </html>
Archivo externo : GfG.js
Javascript
console.log("Hi Geeks, Welcome to GfG");
Salida :
Hi Geeks, Welcome to GfG
¿Qué es JavaScript externo?
JavaScript externo es cuando el código JavaScript (script) se escribe en otro archivo que tiene una extensión .js y luego vinculamos este archivo dentro de la etiqueta <head> o <body> de nuestro archivo HTML en el que se agregará el código. El uso de JavaScript externo es más práctico cuando se va a utilizar el mismo código en muchas páginas web diferentes. Usar un script externo es fácil, simplemente coloque el nombre del archivo de script (nuestro archivo .js) en el atributo src (fuente) de la etiqueta <script>. El archivo JavaScript externo no puede contener etiquetas <script>.
Sintaxis:
<script type="media_type" src="URL"> </script>
Valores de atributos:
- tipo : Texto predeterminado
- un
- asíncrono : es
- que
- integridad : es
- referrerpolicy : Es
También se pueden agregar múltiples archivos de script a una página usando varias etiquetas <script>.
<script src="file1.js"> </script> <script src="file2.js"> >/script>
Ejemplo : este ejemplo describe el uso de los archivos javascript externos donde un puntero se desplaza sobre el texto específico y luego el texto cambia a un texto diferente.
HTML
<!DOCTYPE html>
<html>
<head>
<title>External JavaScript</title>
<style>
h2 {
box-sizing: border-box;
width: 250px;
height: 150px;
background-color: green;
color: white;
margin: auto;
font-size: 15px;
font-family: sans-serif;
text-align: center;
padding: 20px;
}
</style>
</head>
<body>
<h2 class="external">GeeksforGeeks</h2>
<script src="GfG.js"></script>
</body>
</html>
Código JS:
GfG.js
let h2 = document.querySelector(".external");
h2.addEventListener("mouseenter", function (e) {
h2.innerText = "Hi Geeks, Welcome to GfG";
});
Salida : cuando el puntero se ha desplazado sobre el elemento, el texto dentro del elemento (es decir, GeeksforGeeks) cambia a «Hola Geeks, bienvenidos a GfG».
Ventajas de usar JS Interno:
- El navegador no tiene que realizar una solicitud HTTP adicional para el código JavaScript.
- No permite el almacenamiento en caché.
Desventajas de JS interno:
- La legibilidad del código se vuelve pobre.
- El mantenimiento del código se vuelve difícil cuando hay mucho código.
Ventajas de usar JS externo:
- Los archivos HTML y JavaScript se vuelven más legibles y fáciles de mantener.
- La carga de la página se acelera debido a los archivos JavaScript en caché.
Desventajas de JS externo:
- Los codificadores pueden descargar fácilmente su código usando la URL del archivo script (.js).
- El navegador realiza una solicitud extraHTTP para obtener este código JavaScript.
Publicación traducida automáticamente
Artículo escrito por siddharthredhu01 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA