Introducción a jQuery

La biblioteca jQuery se puede agregar a una página web con una simple etiqueta.

Biblioteca jQuery - Características

jQuery es una biblioteca de funciones JavaScript.

La biblioteca jQuery incluye las siguientes características:

  • Selección de elementos HTML
  • Operaciones de elementos HTML
  • Operaciones CSS
  • Funciones de eventos HTML
  • Efectos y animaciones de JavaScript
  • Búsqueda y modificación del DOM HTML
  • AJAX
  • Utilidades

Añadir la biblioteca jQuery a su página

La biblioteca jQuery se encuentra en un archivo JavaScript que contiene todas las funciones de jQuery.

Puede agregar jQuery a su página web utilizando los siguientes marcadores: }}

<head>
<script type="text/javascript" src="jquery.js"></script>
</head>

Por favor note que la etiqueta <script> debe estar ubicada en la sección <head> de la página.

ejemplo básico de jQuery

El siguiente ejemplo demuestra la función hide() de jQuery, que oculta todos los elementos <p> del documento HTML.

ejemplo

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>Este es un encabezado</h2>
<p>Este es un párrafo.</p>
<p>Este es otro párrafo.</p>
<button type="button">Haga clic aquí</button>
</body>
</html>

pruébelo usted mismo

descargar jQuery

Hay dos versiones de jQuery disponibles para descargar: una es reducida, y la otra no está comprimida (para depuración o lectura).

Ambas versiones están disponibles jQuery.com descargar

Sustitución de bibliotecas

Google y Microsoft ofrecen excelente soporte para jQuery.

Si no desea almacenar la biblioteca jQuery en su computadora, puede cargar los archivos del núcleo CDN jQuery de Google o Microsoft.

usar el CDN de Google

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>

usar el CDN de Microsoft

<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>
</head>