Foros del Web » Creando para Internet » Diseño web »

Necesito explicación código AJAX

Estas en el tema de Necesito explicación código AJAX en el foro de Diseño web en Foros del Web. Alguien me podría explicar este pequeño código que cogí para utilizar un div como una especie de iframe: Código: var peticion = false; if (window.XMLHttpRequest) ...
  #1 (permalink)  
Antiguo 27/02/2013, 06:28
Avatar de NestorCss  
Fecha de Ingreso: diciembre-2010
Ubicación: Las Palmas
Mensajes: 16
Antigüedad: 13 años, 5 meses
Puntos: 1
Necesito explicación código AJAX

Alguien me podría explicar este pequeño código que cogí para utilizar un div como una especie de iframe:

Código:
var peticion = false;
if (window.XMLHttpRequest) {
  peticion = new XMLHttpRequest();
} else if (window.ActiveXObject) {
  peticion = new ActiveXObject("Microsoft.XMLHTTP");
}

function cargarExterno(datos,divID) {
  if(peticion) {
   var obj = document.getElementById(divID);
   peticion.open("GET", datos);
   peticion.onreadystatechange = function() {
  if (peticion.readyState == 4) {
   obj.innerHTML = peticion.responseText;
  }
}
peticion.send(null);
}
}
  #2 (permalink)  
Antiguo 27/02/2013, 08:52
 
Fecha de Ingreso: junio-2004
Mensajes: 621
Antigüedad: 19 años, 11 meses
Puntos: 25
Respuesta: Necesito explicación código AJAX

Hola Nestor,
Sin utilizar ningún framework tipo jQuery, se puede utilizar AJAX a través de un objeto JavaScript llamado XMLHttpRequest. el primer if, lo que mira es si estás en un navegador que tenga este objeto de forma nativa, o si estás en Internet Explorer, que lo carga mediante un AvtiveX.

Código:
var peticion = false;
if (window.XMLHttpRequest) {
  peticion = new XMLHttpRequest();
} else if (window.ActiveXObject) {
  peticion = new ActiveXObject("Microsoft.XMLHTTP");
}
Una vez instanciado el objeto "peticion", cuando se invoca a la función cargarexterno envía una variable datos por método GET. La variable datos será unaURL con queryString incluidalago del tipo http://www.midominio.com/pagina?codigo=valor.

Este objeto tiene un controlador de eventos sobre el estado en que está, así peticion.readyState == 4 es que ya ha terminado. En ese caso, coge el div cuya ID has pasado por parámetro y en su innerHTML escribes la respuesta de la petición AJAX peticion.responseText;

Código:
function cargarExterno(datos,divID) {
  if(peticion) {
    var obj = document.getElementById(divID);
    peticion.open("GET", datos);
    peticion.onreadystatechange = function() {
      if (peticion.readyState == 4) {
        obj.innerHTML = peticion.responseText;
      }
    }
    peticion.send(null);
  }
}
Espero haberte ayudado.

Hoy por hoy, que todo el mundo usa un framework JavaScript, esto ya está olvidado, pero aún encuentras sitios donde explican estas cosas en detalle. Te recomiendo el libro de Ajax de Javier Eguiluz.

Puedes ver un primer ejemplo explicado de todo esto en
http://librosweb.es/ajax/capitulo_7/...plicacion.html
__________________
eContento
- Mis artículos y tutoriales
- Mis jsfiddles
  #3 (permalink)  
Antiguo 28/02/2013, 16:04
Avatar de sck1983  
Fecha de Ingreso: noviembre-2005
Ubicación: Sevilla
Mensajes: 110
Antigüedad: 18 años, 5 meses
Puntos: 2
Respuesta: Necesito explicación código AJAX

Muy buena explicación eContento. La verdad es que con la utilización del fra. mejores JQuery esto ya no se utiliza apenas. En la transición entre las consultas sincronías y el JQuery estubieron las consultas asíncronas, estas se conseguían gracias a este tipo de consultas.

Nestorcss como te ha dicho eContento mejor tírate por JQuery que funciona perfectamente y nos facilita el trabajo.

Saludos.
__________________
PhoneGap Spain - La comunidad de habla hispana para programadores de PhoneGap.

www.phonegapspain.com
@phonegapspain
  #4 (permalink)  
Antiguo 28/02/2013, 16:45
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.607
Antigüedad: 22 años, 1 mes
Puntos: 1284
Respuesta: Necesito explicación código AJAX

Hola:

Este tipo de mensajes me resultan fastidiosos, ya que cargar una librería por no comprender unas pocas líneas de código no lo veo lógico.

Ajax es mucho más que eso... y lo que echo en falta es que se plantee ajax de forma accesible.

Mi humilde opinión, es que si solo son necesarias esas pocas líneas (que deberían funcionar perfectamente), la complicación es adaptar extensas librerías para conseguir el mismo objetivo

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo

Última edición por caricatos; 01/03/2013 a las 00:24 Razón: ortografía
  #5 (permalink)  
Antiguo 01/03/2013, 03:30
Avatar de NestorCss  
Fecha de Ingreso: diciembre-2010
Ubicación: Las Palmas
Mensajes: 16
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Necesito explicación código AJAX

Cita:
Iniciado por caricatos Ver Mensaje
Hola:

Este tipo de mensajes me resultan fastidiosos, ya que cargar una librería por no comprender unas pocas líneas de código no lo veo lógico.

Ajax es mucho más que eso... y lo que echo en falta es que se plantee ajax de forma accesible.

Mi humilde opinión, es que si solo son necesarias esas pocas líneas (que deberían funcionar perfectamente), la complicación es adaptar extensas librerías para conseguir el mismo objetivo

Saludos
El problema es que ese código, no lo hice yo, lo cogí de una web y necesitaba que alguien me la explicará que hacía exactamente, ya que debo explicarle a mi profesor que hace realmente ese código y aún no he tocado AJAX o JQuery, he visto algunos códigos y algunos los he entendido más o menos a lógica.

Pero ni aún he empezado por la base de Javascript, meterme con AJAX o JQuery sería morir pero necesitaba que alguien me explicará ese trozo de código para utilizar un div como IFrame.

Muchas gracias a los que han participado en el tema y por recomendarme JQuery.

Saludos
  #6 (permalink)  
Antiguo 01/03/2013, 04:06
 
Fecha de Ingreso: junio-2004
Mensajes: 621
Antigüedad: 19 años, 11 meses
Puntos: 25
Respuesta: Necesito explicación código AJAX

Cita:
Iniciado por caricatos Ver Mensaje
[...]Mi humilde opinión, es que si solo son necesarias esas pocas líneas (que deberían funcionar perfectamente), la complicación es adaptar extensas librerías para conseguir el mismo objetivo [...]
Estoy de acuerdo con Caricatos, como casi siempre desde hace tantos años.

Muchas veces se "usan cañones para matar moscas". Y si sólo se va a utilizar un pequeño porcentaje del framework, no vale la pena cargarlo entero para usar sólo alguna funcionalidad. Siempre es preferible conocer bien la base, que es dominar JavaScript, y dependiendo de lo que se vaya a usar en cada proyecto, usar JavaScript sólo o apoyándose en alguna librería. Y hay muchas muy ligeras. Mucho más que jQuery.

Pero es cierto eso que contaba al principio del mensaje... Hoy la gente sabe jQuery pero no sabe JavaScript... conocen el framework, pero han olvidado (o nunca aprendido) los cimientos sobre los que se apoya. Y para ejemplo este post, en el que se evidencia que hay muchos que no conocen el objeto XMLHttpRequest.

Un saludo
__________________
eContento
- Mis artículos y tutoriales
- Mis jsfiddles
  #7 (permalink)  
Antiguo 01/03/2013, 18:58
Avatar de NestorCss  
Fecha de Ingreso: diciembre-2010
Ubicación: Las Palmas
Mensajes: 16
Antigüedad: 13 años, 5 meses
Puntos: 1
Respuesta: Necesito explicación código AJAX

Cita:
Iniciado por eContento Ver Mensaje
Estoy de acuerdo con Caricatos, como casi siempre desde hace tantos años.

Muchas veces se "usan cañones para matar moscas". Y si sólo se va a utilizar un pequeño porcentaje del framework, no vale la pena cargarlo entero para usar sólo alguna funcionalidad. Siempre es preferible conocer bien la base, que es dominar JavaScript, y dependiendo de lo que se vaya a usar en cada proyecto, usar JavaScript sólo o apoyándose en alguna librería. Y hay muchas muy ligeras. Mucho más que jQuery.

Pero es cierto eso que contaba al principio del mensaje... Hoy la gente sabe jQuery pero no sabe JavaScript... conocen el framework, pero han olvidado (o nunca aprendido) los cimientos sobre los que se apoya. Y para ejemplo este post, en el que se evidencia que hay muchos que no conocen el objeto XMLHttpRequest.

Un saludo
En el ciclo en el que estoy dentro de poco daremos Javascript, asi que... me iniciaré y ya luego irán las librerias como ustedes dicen.

Muchas gracias a todos, grandes consejos :D!

Etiquetas: ajax
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:58.