Diferentes formas de incluir jQuery en una página web

En este artículo, vamos a aprender diferentes formas de incluir jQuery en una página. Básicamente, sabemos que jQuery viene con muchas características interesantes. Entonces, si queremos usar esas funciones, solo tenemos que agregar la biblioteca jQuery a nuestra página web.

Hay dos formas de agregar la biblioteca jQuery a nuestra página web.

  • Incluir jQuery de CDN (red de entrega de contenido)
  • Descargue la biblioteca jQuery del sitio web oficial

1. Incluya jQuery de CDN Link: CDN significa Red de entrega de contenido, que es básicamente un conjunto de servidores utilizados para almacenar y entregar datos. Básicamente, estos archivos de la biblioteca jQuery ya están cargados en varios CDN y podemos usarlos directamente en nuestra página web. Entonces, no necesitamos descargar ningún archivo en nuestra máquina local.

<secuencia de comandos src=”https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js”></secuencia de comandos>

Podemos ver el enlace CDN dentro del atributo «src». Hemos agregado con éxito jQuery a nuestra página web. Podemos usar todas las características de jQuery en nuestra página. Mientras carga la página, el navegador descargará automáticamente los archivos de la biblioteca jQuery desde el enlace CDN.

Ejemplo 1: en este ejemplo, agregaremos un enlace jQuery CDN para ejecutar el código jQuery.

HTML

<!DOCTYPE html>
<html>
  
<head>
    <!-- jQuery library -->
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js">
    </script>
</head>
  
<body>
    <p></p>
      
    <script>
        $('p').text('Hello geeks. CDN Working');
    </script>
</body>
  
</html>

Producción:

2. Descarga la librería jQuery: De esta forma agregaremos la librería jQuery a nuestra página. Primero, descargaremos los archivos de la biblioteca jQuery a nuestro servidor local desde el sitio web de jQuery . Después de la descarga, agregaremos los archivos descargados a nuestra página web de esta manera.

<script src="file_name_with_full_path"></script>

Ejemplo 2: en este ejemplo, agregaremos un enlace jQuery desde la ruta descargada para ejecutar el código jQuery.

HTML

<!DOCTYPE html>
<html>
  
<head>
    <!-- jQuery library -->
    <script src="jquery-3.6.0.js"></script>
</head>
  
<body>
    <p></p>
      
    <script>
        $('p').text('Hello geeks. Downloaded files');
    </script>
</body>
  
</html>

Producción:

En el caso anterior, la página web y los archivos de la biblioteca jQuery están en la misma carpeta.

Publicación traducida automáticamente

Artículo escrito por hritikrommie y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *