Executing Javascript on Various Web Pages

Option 1: Execute via Drag and Drop

• Open a webpage in Google Chrome
• Highlight the code below and drag it onto the Tab just opened:
  javascript:alert('Hello World');

Note: This method works well for a one click execution of your code. This allows demos directly from a tutorial or documentation page.
Note: This may not work in Firefox but depends on the browser configuration for javascript.
Note: This link may also be dragged into the Firefox Bookmarks Menu or the Google Chrome Bookmarks Toolbar.
Note: Instead of dragging the whole javascript code, you may also drag a hyperlink like this: Hello World Bookmark. This was created from the following html:

<a href="javascript:alert('Hello World');">Hello World Bookmark</a>

Option 2: Execute via Address Bar

• Open a webpage in Google Chrome
• Type the following into the address bar:
  javascript:alert('Hello World');
• Press Enter

Note: This may not work in Firefox but depends on the browser configuration for javascript.
Note: When copying this code, make sure that the prefix "javascript:" is copied. In some cases, this will have to be manually typed.

Option 3: Execute via Console

• Open a webpage in Google Chrome or Firefox
• Right click the page, Inspect Element
• Switch to the Console Tab
• Type the following code:
  javascript:alert('Hello World');
• Press Enter

Note: Accessing the console will vary depending on the browser and plugins. However, in most cases you need the previx "javascript:".

Option 4: Execute via Bookmark

• Open a webpage in Google Chrome or Firefox
• Go to the Bookmark Menu and select the Bookmark

Note: Option 1 above shows how to create a new bookmark via drag and drop. However, below are instructions on how to manually create a Bookmark which will execute javascript code.

Manually Creating a Bookmark

• Open a webpage in Firefox
• From the Bookmark Menu, Bookmark This Page
• From the Bookmark Menu, Right Click the new Bookmark, Properties
• Change the Name to "Hello World Bookmark"
• Change the Location to "javascript:alert('Hello World');"
• Save the bookmark

Note: Similar directions will work in Google Chrome.

Hosting Your Javascript Code

For more complicated javascript, I suggest hosting the main javascript code on a server. This requires a few pieces:

• Executing the following javascript code through one of the options previously mentioned on this page:
  javascript:addScript=function(){s=document.getElementById("bmScript");if(s){document.body.removeChild(s);}s=document.createElement("script");s.id="bmScript";s.src="http://localhost:8080/HelloWorld.js";document.body.appendChild(s);};void(addScript());
• Placing the javascript code on the server (for example, if using Tomcat as a server, the above javascript code assumes a file HelloWorld.js is placed in the ROOT Tomcat directory)
• Running a server somewhere (for example, if using Tomcat as a server, the above javascript code assumes a Tomcat server is running on the same machine which is executing the code so that localhost:8080 is available)

Note: The javascript here, which will be executed on the page adds a script element to the page. When the script element is added, it will also be loaded. At this point, the src found on the server will be executed as well.