I’ve posted this script on the blog before in a joint post, but as I really do love it i thought it deserved it’s own post. With this awesome script you can edit any web page you want live in the browser. You can change text, move images around, re-align components, whatever you want really. Great for web designers who want to quickly show changes in a web page to a client for example.
JavaScript Edit Web Page Directly
Simply copy and paste this code snippet into the address bar and press enter.
javascript: document.body.contentEditable = 'true'; document.designMode = 'on'; void 0
jQuery Visual Event
If you’re interested in quickly seeing what elements on a page have jquery events attached to them then this bookmark script is just for you! Click the button below to test it out!
Instructions
- Drag+drop the ‘Visual Events’ bookmark button below onto your toolbar
- Visit Web Page
- Click Bookmark
- Change Underwear
Subscribe by RSS
Subscribe by Email
Awesome tool! Best tip of the month. Showing all javascript attached.
Just tried this on google.com. Found out that their logo has the following js-code:
1 function onload(event) {
2 window.lol && lol();
3 }
lol?! ;)
“Javascript edit web page directly” would be a great help to me except when I exit the page after making a change, the change does not appear on the site the next time I go to it. I don’t see a way to register the change.
What am I missing?
Thanks,
Bob