$(slector).load('page.html #id') Vs $.get And Filter/find #id

- 1 answer

I would like to know if there is any difference in perfomance (or difference at all)

Between this:

$(selector).load('page #myid');


     $(selector).html( $(data).find('#myid') );
     /* depending the dom tree it should be .filter() */


I would say using load() or .get() is more to do with your intentions and requirements rather than performance.


.load() is for easy/simple loading of a document or a portion of it.
It will load the complete document and then using innerHTML parse the HTML to return only the portion you are interested in.

If you only need a fast way of loading some content into a div then $(element).load(url, selector) is the way to go. I would assume load() is optimised for just that.


Unlike load(), .get() allows setting of the dataType for greater flexibility such as JSONP for cross-domain requests.

It also implements the promise interface, giving it all the features of a Deferred Object.

From the docs:

The Promise interface also allows jQuery's Ajax methods, including $.get(), to chain multiple .done(), .fail(), and .always() callbacks on a single request, and even to assign these callbacks after the request may have completed. If the request is already complete, the callback is fired immediately.


On a very basic level, there should be no worth-while performance difference between a simple .load(url, selector) and .get(url, callback). Using either should be fine.

I would think, there is no right or wrong here as such. Use what ever suits your needs.

Ask yourself question similar to:

Do you need cross-domain (JSONP)?
Do you need to chain .fail(), .done(), etc. ?
Do you need any of the features get() offers which load() does not have?

If you use load() or get() depends on your requirements. Performance is secondary in this case.