How can I load an external JavaScript file using a bookmarklet? This would overcome the URL length limitations of IE and generally keep things cleaner.
How can I load an external JavaScript file using a bookmarklet? This would overcome the URL length limitations of IE and generally keep things cleaner.
Content security policy will prevent this from working in many sites now. For example, the code below won't work on Facebook.
Use a bookmarklet that creates a script tag which includes your external JS.
As a sample:
javascript:(function(){document.body.appendChild(document.createElement('script')).src='** your external file URL here **';})();
If I can add method tested in FF & Chrome (for readibility split to multiple lines):
javascript:var r = new XMLHttpRequest();
r.open("GET", "https://...my.js", true);
r.onloadend = function (oEvent) {
new Function(r.responseText)();
/* now you can use your code */
};
r.send();
undefined
It is no longer recommended to do this as CSP on most website will make it fail. But if you still want to use it: 2022 example
(() => {
const main = () => {
// write your code here
alert($('body')[0].innerHTML)
}
const scriptEle = document.createElement('script')
scriptEle.onload = main
scriptEle.src = 'https://cdn.jsdelivr.net/npm/jquery@3.6.1/dist/jquery.min.js'
document.body.appendChild(scriptEle)
})();
I always prefer to use a popular open source project loadjs
it is cross browser tested and has more functionality/comfort features.
So the code will look like this:
loadjs=function(){function e(e,n){var t,r,i,c=[],o=(e=e.push?e:[e]).length,f=o;for(t=function(e,t){t.length&&c.push(e),--f||n(c)};o--;)r=e[o],(i=s[r])?t(r,i):(u[r]=u[r]||[]).push(t)}function n(e,n){if(e){var t=u[e];if(s[e]=n,t)for(;t.length;)t[0](e,n),t.splice(0,1)}}function t(e,n,r,i){var o,s,u=document,f=r.async,a=(r.numRetries||0)+1,h=r.before||c;i=i||0,/(^css!|\.css$)/.test(e)?(o=!0,(s=u.createElement("link")).rel="stylesheet",s.href=e.replace(/^css!/,"")):((s=u.createElement("script")).src=e,s.async=void 0===f||f),s.onload=s.onerror=s.onbeforeload=function(c){var u=c.type[0];if(o&&"hideFocus"in s)try{s.sheet.cssText.length||(u="e")}catch(e){u="e"}if("e"==u&&(i+=1)<a)return t(e,n,r,i);n(e,u,c.defaultPrevented)},!1!==h(e,s)&&u.head.appendChild(s)}function r(e,n,r){var i,c,o=(e=e.push?e:[e]).length,s=o,u=[];for(i=function(e,t,r){if("e"==t&&u.push(e),"b"==t){if(!r)return;u.push(e)}--o||n(u)},c=0;c<s;c++)t(e[c],i,r)}function i(e,t,i){var s,u;if(t&&t.trim&&(s=t),u=(s?i:t)||{},s){if(s in o)throw"LoadJS";o[s]=!0}r(e,function(e){e.length?(u.error||c)(e):(u.success||c)(),n(s,e)},u)}var c=function(){},o={},s={},u={};return i.ready=function(n,t){return e(n,function(e){e.length?(t.error||c)(e):(t.success||c)()}),i},i.done=function(e){n(e,[])},i.reset=function(){o={},s={},u={}},i.isDefined=function(e){return e in o},i}();
loadjs('//path/external/js', {
success: function () {
console.log('something to run after the script was loaded');
});