Diferencia entre revisiones de «Usuario:ManuelRomero/JavaScript/jquery/conceptosGenerales»

De WikiEducator
Saltar a: navegación, buscar
(Cómo usar JQuery)
(Sintaxis)
Línea 42: Línea 42:
 
<script type="text/javascript" src="jquery-1.10.2.js"></script>
 
<script type="text/javascript" src="jquery-1.10.2.js"></script>
 
</source>
 
</source>
 +
 +
==== Uso de un CDN ====
 +
 +
*También a través de un '''CDN''' (Content Delivery Network).
 +
*¿Qué es un CDN? Grupo de servidores repartidos por todo el mundo en puntos estratégicos y pensados para la distribución de ficheros):
 +
* CDN de Google:
 +
<source lang="javascript">
 +
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
 +
</source>
 +
*CDN de Microsoft:
 +
<source lang="javascript">
 +
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script>
 +
</source>
 +
*CDN del propio jQuery:
 +
: Minified:
 +
<source lang="javascript">
 +
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
 +
</source>
 +
:Full:
 +
<source lang="javascript">
 +
<script type="http://code.jquery.com/jquery-1.10.2.js"></script>
 +
</source>
 +
</div>
 +
 +
<div class="slide">
  
 
===Sintaxis===
 
===Sintaxis===

Revisión de 09:42 2 abr 2016



http://www.desarrolloweb.com/manuales/manual-jquery.html

Qué es JQuery

  • Es una librería de funciones de javascript que facilita el uso de javascript
  • Nosotros nos vamos a centrar en la parte del DOM (elementos y eventos en la página html)
  • También se conoce como un framework, que viene siendo un entorno para desarrollar software en un determinado lenguaje, donde se facilita al desarrollador muchas acciones a la hora de hacer un programa.

Para qué sirve JQuery

  • Para usar JQuery, hemos de conocer las tecnologías en las cuales lo vamos a utilizar
  1. HTML
  2. CSS
  3. JavaScript

JQuery es un entorno ligero que parte de la filosofía escribe menos, haz mas

  • Cosas que se pueden hacer con JQuery:

Manipular la página HTML a través del DOM Manipular CSS Acceder y controlar los eventos de la página html

  1. Efectos y animaciones
  2. AJAX
  3. Incorporar Utilidades
  4. HTML/DOM manipulation
  5. CSS manipulation
  6. HTML event methods
  7. Effects and animations
  8. AJAX
  9. Utilities realizadas en JQuery

Cómo usar JQuery

  • Para usar jquery debemos especificar el fichero donde están los fuentes de la librería

(Comment.gif: *Al final solo son una librerías de javascript que van a hacer más facil hacer ciertas tareas)


  • Podemos indicar dónde está el fuente en internet o descargarlo a nuestro ordenador
  1. descargarlo https://jquery.com/download/
  2. Especificar su ubucación en internet

Versión de producción:

	<script type="text/javascript" src="jquery-1.10.2.min.js"></script>

Versión de desarrollo

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

Uso de un CDN

  • También a través de un CDN (Content Delivery Network).
  • ¿Qué es un CDN? Grupo de servidores repartidos por todo el mundo en puntos estratégicos y pensados para la distribución de ficheros):
  • CDN de Google:
	<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
  • CDN de Microsoft:
	<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script>
  • CDN del propio jQuery:
Minified:
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
Full:
	<script type="http://code.jquery.com/jquery-1.10.2.js"></script>

</div>

Sintaxis

  • La sintaxis de JQuery es muy sencilla
  • La filosofía de uso es hacer una acción sobre un conjunto (1 o mas) elementos seleccionados.
  • La sintaxis básica es
 $(selector).accion();
  • Donde
  1. $ indica que vamos a acceder a la bliblioteca jQuery
  2. selector permitirá identificar el elemento o elementos de la página a la que nos referimos (un determando id, elementos de tipo img, ...
  3. accion() es la acción que queremos realizar (ocultar, escibir, modificar propiedades , ...)

Seleccionar elementos del DOM con JQuery

Aplicando efectos con JQuery

Encadenando métodos en JQuery

Dom y JQuery; Modificando elemntos

Dom y JQuery; Accediendo a los atributos

JQuery y CSS

JQuery y Formularios

JQuery y Eventos

JQuery Validando formularios con plugin

==== JQueryUI: Interfaz gráfico con JQuery====