How to implement jQuery's load() function in Javascript?

Question

I am making an async call from a webpage to another resource at a url like /example/url/here.html which contains a partial view and inserting the response into the innerHTML of a div on the first page. However, the partial view here.html might contain <script> references and some inline script that doesn't get loaded/run when inserting to innerHTML.

I'm wondering if jQuery's load() function would solve this, and if so how to implement a similar function in javascript, as I cannot use jQuery.

Here's the code I'm using that isn't working:

     function (elemId, url) {

        var successCallback = function (responseText) {
            var elem = document.getElementById(elemId);
            elem.innerHTML(responseText);
        };

        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function () {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                successCallback(xmlhttp.responseText);
            }
        };

        xmlhttp.open("GET", url, true);
        xmlhttp.send();

    }

You need to do what jQuery does: parse the responseText and look for <script> elements. It extracts them and creates new <script> nodes with the content. — Barmar
– Barmar, Commented Jan 17, 2015 at 1:49
So if I create new <script> nodes it will load/execute them? — Zack
– Zack, Commented Jan 17, 2015 at 2:04
Take the jQuery source code for the function, after all, jQuery is just Javascript. — Etheryte
– Etheryte, Commented Jan 17, 2015 at 2:04
@Nit The code for this is buried deep inside the .html() code, it's not in .load() itself. — Barmar
– Barmar, Commented Jan 17, 2015 at 2:05

Oakley · Accepted Answer · 2015-01-17 01:56:29Z

0

I think what you want to do is load the html partial via jquery like this:

<div id="partial" ></div>

$('#partial').load('somefile.html');

answered Jan 17, 2015 at 1:56

Oakley

66611 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Zack Over a year ago

Yeah, that's what I'm trying to figure out is how to implement that without jQuery.

Oakley Over a year ago

Ah, I see what you mean. github.com/jquery/jquery/blob/…

Collectives™ on Stack Overflow

How to implement jQuery's load() function in Javascript?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related