Little tweaks with javascript : Bookmarklets.
A bookmarklet is a snippet of Javascript that can be bookmarked (or saved as a favorite) inside your web browser. Bookmarklets can enhance web pages, add special functionality using javascript which is supported by most browsers today and make your browsing experience a lot more efficient by offering one-click access. I will first start with basics.
Consider a simple javascript :
- javascript:alert(‘You clicked on the page’);
When you type this in browsers location bar then it will show a message box with “you clicked on the page” message. Now change this slightly :
- javascript:function ab(){alert(“hello”) ;};void(setInterval(ab,1));
Now this will repeatedly pop-up the message box in every 1-sec interval. Though this is of no use i’m just telling this to explain basics of javascript.
Now filling form with javascript :
- javascript:function ab() {document.forms[0].login_username.value=”someText” ; } ab() ;
Now this javascript will fill the value “someText” in field login_username of form in html page.
And lets try to take some user-input :
- javascript:function ab() {q=document.getSelection(); if(!q) {void(q=prompt(‘Text :’,”))} else alert(q)} ab();
Now this javascript will first check if some text is selected on page. If no text is selected it will prompt user for text else will show an message box with selected text. Now we can put this script to some good use : like
- javascript:function ab(){q=document.getSelection(); if(!q){void(q=prompt(‘Search Text at My Blog: ‘,”))} location.href=”http://www.technorati.com/search/ “+q+” linux?from=http://burad.blogspot.com “; }; ab();
Now this will search the selected text on my blog or if text is not selected than prompt user for text.
An equivalent script for searching on wikipedia is :
- javascript:(function(){q=document.getSelection(); if(!q){void(q=prompt(‘Wikipedia keywords:’,”))}; if(q) location.href= ‘http://en.wikipedia.org/w/wiki.phtml?search=’+escape(q)})()
Now you can bookmark this script in toolbar so every tim you click on button in toolbar it will execute javascript. For example Drag this to your firefox bookmark toolbar :
Some more bookmarklets :
Scale Images
So in a way they are different from bookmarks and provides extra functionality through power of javascript. Here are some more javascript bookmarklet
You can view source for each bookmarklet by viewing page source .
You can find more bookmarklets at : http://www.squarefree.com/bookmarklets/
See this helpful screencast on bookmarklets.
Some More Example at Wisdombay
Updated : For changing documenet backgrounds :
Change to Red
Change to green
Change to blue
This may not work with pages using css
Comments
7 Responses to “Little tweaks with javascript : Bookmarklets.”
Leave a Reply
Subscribe
Contact
aburad [at] gmail [dot] com
Add to del.icio.us Network
Google Reader Shared Items
Twitter Feed
Flickr Photos
Subscribe in a reader
Thanks a lot for a very nice write-up on bookmarklets!
I read over your blog, and found it inquisitive. You may find my blog interesting.
Dear Ajith,
I found your blog through Google BlogSearch and found it very interesting. May be your readers could benefit from the Bookmarklet section on my site, which we keep updated on a daily basis. You can access it here
http://www.wisdombay.com/bm/bm00001.htm
[...] Little tweaks with javascript : Bookmarklets. [...]
[...] Post: Firefox About Pages Little tweaks with javascript : Bookmarklets. Open webpages in [...]
[...] Related Links : Play with html using javascript Little tweaks with javascript bookmarklet [...]
By default I believe that it is two images. ,