1

Lo que quiero es que al iniciar una pagina, se cargue el Ajax automáticamente, ya que ese sera el DIV que cargara otras pagina o funciones a futuro, pero de momento no se aparece o me marca nada. El JS no esta en la pagina central sino en otro archivo. Este es el código HTML y JS:

<!DOCTYPE html>
<html>
    <head>
        <script src="cargaBio.js"></script>
    </head>

    <body onload="loadDoc();">
            <!-- CENTRO -->
            <section id="centro">
                <div id="biografia_es"></div>
            </section>
    </body>
</html>
 function() loadDoc() {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("biografia_es").innerHTML = this.responseText;
        }
    };
    xhttp.open("GET", ".\biografia_es.html", true);
    xhttp.send();
}

Cualquier ayuda se agradece.

1
  • Hola, bienvenido a la comunidad. Te invito a hacer el recorrido y leer ¿cómo preguntar? para que tu pregunta sea bien recibida por parte de la comunidad. Redactando respuesta. el 18 mar. 2020 a las 21:23

1 respuesta 1

0

Deberías consultar la consola de depuración de javascript con más frecuencia. Tu código genera los siguientes errores:

Uncaught SyntaxError: Function statements require a function name
Uncaught ReferenceError: loadDoc is not defined at onload

El primero es debido a que no estás definiendo correctamente la función:

function() loadDoc() {

Debería ser:

function loadDoc() {

Por eso al intentar llamar a la función loadDoc, que no ha sido definida, lanza el segundo error.

Prueba de funcionamiento:

function loadDoc() {
    console.log('Cargando XHR');
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = () => {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("biografia_es").innerHTML = this.responseText;
        }
    };
    xhttp.open("GET", ".\biografia_es.html", true);
    xhttp.send();
}
<!DOCTYPE html>
<html>
    <head>
        <script src="cargaBio.js"></script>
    </head>

    <body onload="loadDoc();">
            <!-- CENTRO -->
            <section id="centro">
                <div id="biografia_es"></div>
            </section>
    </body>
</html>

5
  • Estuve haciendo pruebas todo el día y no me funciono, aun así muchas gracias. el 19 mar. 2020 a las 4:59
  • Al final lo hice así: function loadDoc() { console.log('Cargando XHR'); $("#biografia_es").load('biografia_es.html'); return false; } el 19 mar. 2020 a las 5:28
  • ¿El qué no te funcionó? ¿La carga del archivo? Imagino que ".\biografia_es.html" no es una ruta válida. el 19 mar. 2020 a las 6:51
  • No me cargo el archivo, a pesar de los cambios, no entiendo el porque, la ruta si es la correcta, al final quedo mas sencillo, muchas gracias. el 19 mar. 2020 a las 21:22
  • Me alegra que te funcione. el 19 mar. 2020 a las 21:31

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.