Equivalent to $.load without jQuery

I think you can do this with the following;

var request = new XMLHttpRequest();request.open('GET', '/somepage', true);request.onload = function() {  if (request.status >= 200 && request.status < 400) {    var resp = request.responseText;    document.querySelector('#div').innerHTML = resp;  }};request.send();

By the way, you can do this with fetch API too.

fetch('/somepage')  .then(function(response) {    return response.text();  })  .then(function(body) {    document.querySelector('#div').innerHTML = body;  });

By the way, you can read this blog post for learning something about fetch API.

While I was trying to solve the same problem, I made this which is based on Ali BARIN's answer, and seems to work great but is a bit more explicit version, adding init information, and has some logic to use document.getElementById instead of querySelector.

/* * Replicates the functionality of jQuery's `load` function,  * used to load some HTML from another file into the current one. *  * Based on this Stack Overflow answer: * https://stackoverflow.com/a/38132775/3626537 * And `fetch` documentation: * https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch *  * @param {string} parentElementId - The ID of the DOM element to load into * @param {string} htmlFilePath - The path of the HTML file to load */const loadHtml = function(parentElementId, filePath) {    const init = {        method : "GET",        headers : { "Content-Type" : "text/html" },        mode : "cors",        cache : "default"    };    const req = new Request(filePath, init);    fetch(req)        .then(function(response) {            return response.text();        })        .then(function(body) {            // Replace `#` char in case the function gets called `querySelector` or jQuery style            if (parentElementId.startsWith("#")) {                parentElementId.replace("#", "");            }            document.getElementById(parentElementId).innerHTML = body;        });};