Search code examples
jquerydomloadbookmarkletdocument-ready

Where to add addtional logic for a jQuery bookmarklet?

https://mreidsma.github.io/bookmarklets/jquerify.html

Apologies in advance for this novice javascript question... The link above works very well to load jQuery. However I want to add additional jQuery selectors statements like the following below:

$('#mruSelect').hide();

However this looks to be a timing issue and I'm not sure where in the following code I can safely add this after jQuery loads...

javascript:(function(){var el=document.createElement("div"),b=document.getElementsByTagName("body")[0],otherlib=!1,msg="";el.style.position="fixed",el.style.height="32px",el.style.width="220px",el.style.marginLeft="-110px",el.style.top="0",el.style.left="50%25",el.style.padding="5px 10px",el.style.zIndex=1001,el.style.fontSize="12px",el.style.color="#222%22,el.style.backgroundColor=%22#f99%22;function%20showMsg(){var%20txt=document.createTextNode(msg);el.appendChild(txt),b.appendChild(el),window.setTimeout(function(){txt=null,typeof%20jQuery==%22undefined%22?b.removeChild(el):(jQuery(el).fadeOut(%22slow%22,function(){jQuery(this).remove()}),otherlib&&(window.$jq=jQuery.noConflict()))},2500)}if(typeof%20jQuery!=%22undefined%22)return%20msg=%22This%20page%20already%20using%20jQuery%20v%22+jQuery.fn.jquery,showMsg();alert('test');typeof%20$==%22function%22&&(otherlib=!0);function%20getScript(url,success){var%20script=document.createElement(%22script%22);script.src=url;var%20head=document.getElementsByTagName(%22head%22)[0],done=!1;script.onload=script.onreadystatechange=function(){!done&&(!this.readyState||this.readyState==%22loaded%22||this.readyState==%22complete%22)&&(done=!0,success(),script.onload=script.onreadystatechange=null,head.removeChild(script))},head.appendChild(script)}getScript(%22//code.jquery.com/jquery.min.js%22,function(){return%20typeof%20jQuery==%22undefined%22?msg=%22Sorry,%20but%20jQuery%20was%20not%20able%20to%20load%22:(msg=%22The%20Recent%20Items%20is%20now%20hidden%22,otherlib&&(msg+=%22%20and%20noConflict().%20Use%20$jq;,%20not%20$().%22)),showMsg()})})();

There is an alert statement buried in there that I added and it works, but adding jQuery there won't work because it isn't available yet.

Solution

  • I determined that you couldn't guarantee if jQuery was loaded or not. So I decided to add the following after the showMsg(); function call.

    document.getElementById('mruSelect').style.display = 'none';