JavaScript/Bookmarklets - Wikibooks, open books for an open world

Bookmarklets are one line scripts stored in the URL field of a bookmark. Bookmarklets have been around for a long time so they will work in older browsers.

JavaScript URI scheme[edit | edit source]

You should be familiar with URL that start with schemes like http and ftp, e.g. http://en.wikibooks.org/. There is also the JavaScript scheme, which is used to start every bookmarklet.

JavaScript:alert('Hello, World!');

Example uses[edit | edit source]

Media controls[edit | edit source]

The values in these examples can be adapted as desired. One may replace video with audio where applicable, meaning where an <audio> tag is embedded.

Loop the video

javascript:document.getElementsByTagName("video")[0].loop=1;
javascript:document.getElementsByTagName("video")[0].loop=true; // also works

Can be switched off using 0 or false.

Jump to ten minutes (using multiplication)

javascript:document.getElementsByTagName("video")[0].currentTime=60*10;

Jump forward by one minute (sixty seconds)

javascript:document.getElementsByTagName("video")[0].currentTime+=60;

Jump back by half a minute (using division)

javascript:document.getElementsByTagName("video")[0].currentTime-=60/2;

Get duration of a video on the page in console

javascript:document.getElementsByTagName("video")[0].duration

Alert the duration

javascript:alert('This video is '+document.getElementsByTagName("video")[0].duration+' seconds long.')

Alert the playback time

javascript:alert('The current position of the video is at '+document.getElementsByTagName("video")[0].currentTime+' seconds.')

Set audio volume to 50%

javascript:document.getElementsByTagName("video")[0].volume=50/100

Mute audio

javascript:document.getElementsByTagName("video")[0].muted=1 // "true" works as well

Unmute using 0 or false.

Double the playback speed

javascript:document.getElementsByTagName("video")[0].playbackRate=2

Ask for playback speed

javascript:document.getElementsByTagName("video")[0].playbackRate= parseFloat( prompt("How fast should it play?") );

parseFloat is necessary to prevent setting the value to zero if the dialogue window is closed without user input.

Ask for playback position in percentage (0 to 100)

javascript:document.getElementsByTagName("video")[0].currentTime=document.getElementsByTagName("video")[0].duration/100*parseFloat( prompt("Jump to playback position in percents:") );

Using multiple lines of code[edit | edit source]

Since you cannot have line breaks in bookmarklets you must use a semicolon at the end of each code statement instead.

JavaScript:name=prompt('What is your name?'); alert('Hello, ' + name);

The JavaScript Protocol in Links[edit | edit source]

The JavaScript protocol can be used in links. This may be considered bad practice, as it prevents access for or confuses users who have disabled JavaScript. See Best Practices.

<a href="JavaScript:document.bgColor='#0000FF'">blue background</a>

Examples[edit | edit source]

A large quantity of links may be found on bookmarklets.com, which show a variety of features that can be performed within JavaScript.