Loading jQuery after AngularJS (instead of before)

Question

In order to let angular.element point to jQuery instead of jQLite, one needs to load jQuery before Angular in the page head.

However, for performance reasons(especially

Answer 1

You can manually extend JQLite prototype after jQuery is loaded:

angular.extend(angular.element.prototype, jQuery.fn);

However since this is not designed usage of jQuery with Angular it might bring unwanted problems. But if your only intention is to extend angular.element with some useful jQuery methods, this should be fine.

Check the demo below to see how jQuery's methods are available in angular.element even though jQuery is loaded after Angular.

Demo: http://plnkr.co/edit/fo70VtmgBCQDU9RWGGVF?p=preview