Javascript-эквивалент JQuery-метода .load()?

Question

[Сергей]

У JQuery есть замечательный метод load:
$("#container").load("test.svg");

Эквивалент на js:

function loadFile(url, id) {
  var request = new XMLHttpRequest();
  request.open('GET', url, true);
  request.send();

  request.onreadystatechange = function() {
    if (this.readyState != 4) return;
  
    if (this.status != 200) {
      console.log('Ошибка: ' + (this.status ? this.statusText : 'запрос не удался'));
      return;
    }

    document.getElementById(id).innerHTML = this.responseXML;
  }
}

loadFile("test.svg", "container");

Но как на js будет выглядеть метод load, у которого есть callback?

$("#container").load( "test.svg", function() {
  console.log( "This is callback function" );
});

Answer 1

[kn1ght_t]

function loadFile(url, id, callback) {
  var request = new XMLHttpRequest();
  request.open('GET', url, true);
  request.send();

  request.onreadystatechange = function() {
    if (this.readyState != 4) return;
  
    if (this.status != 200) {
      console.log('Ошибка: ' + (this.status ? this.statusText : 'запрос не удался'));
      return;
    }

    document.getElementById(id).innerHTML = this.responseXML;

    callback();
  }
}

?

Answer 2

[Никита Егоров]

function loadFile(url, id, callback) {
    // Код запроса

    request.onload = (event) => {
        callback()
    }
}

Вообще, то что вы написали можно сделать короче, например так (но смотрите сюда)

Jsfiddle

function load(src, selector, callback) {
    fetch(src)
        .then(response => response.text())
        .then(svg => {
            let elements = Array.from(document.querySelectorAll(selector))
            elements.map(n => n.innerHTML = svg)
      
            callback()
        });
}

Answer 3

[profesor08]

loadFile(url, id, callback)
...
document.getElementById(id).innerHTML = this.responseXML;
callback("parampam");
...

loadFile(url, id, function(param) {
  alert(param);
})