CODEWITHSUNDEEP
javascripthtml
test
test

Reputation: 18198

Edit JavaScript blocks of web page... live

I know you can use Firebug in the DOM view to edit JavaScript variables BUT... is there a way I can use (anything else) to edit live JavaScript that is embedded in a HTML page?

Like this kind that is in a .html page:

<script type="text/javascript>
// code here
</script>

Thanks.

Upvotes: 7

Views: 10127

Answers (10)

XP1
XP1

Reputation: 7183

You could use Opera 12. Opera 12 allows editing of inline JS and JS files. After you soft reload the page, your changes will be applied. Right click > Source > Make changes > Apply Changes.

Upvotes: 2

line-o
line-o

Reputation: 1895

Firefox' Greasemonkey plugin wasn't mentioned yet. That way you can store, re-use and share youre scripts. I'm not 100% sure you can run your code in the exact same scope as the page's code OOTB. Inserting arbitrary script tags is still possible, though.

Upvotes: 0

Pixus.ru
Pixus.ru

Reputation: 106

You able to edit inline script tags with Firebug's HTML view. Just select script tag, and then press "Edit" button. After editing, press "Edit" button again to apply changes.

Upvotes: 0

pfernandom
pfernandom

Reputation: 939

If you go to Tools/Developer Tools on Chrome, you will find a space where you can change all the code from html, to javascript and CSS, live on your browser. Obviously it does not generate a real change on the page, just in the way you see it, since it just can be edited for the administrator of the website

Upvotes: 0

CAFxX
CAFxX

Reputation: 30301

Firebug has a console (the first tab of the firebug window) where you can write JS code and execute it in the current page. Suppose the webpage has a function called myFunc defined and you want to override it: executing the following in the console will do the trick.

myFunc = function(/* function arguments here */) {
  /* new function body here */
}; /* notice the ; */

and to see the the current version of a function you can execute

uneval(myFunc);

this will print out the current myFunc

note: I think that by default the console comes with a single-line input box, but somewhere in the options you can switch to a multi-line input box. When in multi-line, goes to a new line, + executes the code.

Upvotes: 1

Ryan Castillo
Ryan Castillo

Reputation: 1125

Chrome also has a console window that can be activated once you inspect the element (or page). From there you can write simple javascript. It even has a pretty decent debugger.

Upvotes: 0

Jason LeBrun
Jason LeBrun

Reputation: 13293

Firebug itself has a non-plugin-dependent "lite" version. If you examine the source code of that, you can find out how to implement a large subset of the Firebug functionality.

http://getfirebug.com/firebuglite

Upvotes: 0

Lasse
Lasse

Reputation: 696

Well, you won't be able to edit JavaScript code that has been loaded into your browser, except with the help of that same browser. That basically means through a plug-in and I'm not aware of any plug-ins other than FireBug that will let you do that.

Is there a specific reason you can't/won't use FireBug?

Upvotes: 0

zzzzBov
zzzzBov

Reputation: 179066

bookmarklets

From the Wikipedia entry

A bookmarklet is an applet, a small computer application, stored as the URL of a bookmark in a web browser or as a hyperlink on a web page. The term is a portmanteau of the terms bookmark and applet. Whether bookmarklet utilities are stored as bookmarks or hyperlinks, they are designed to add one-click functionality to a browser or web page. When clicked, a bookmarklet performs some function, one of a wide variety such as a search query or data extraction. Usually the applet is a JavaScript program.

And as a related note not trying to spam or anything I created a bookmarklet generator to help me create bookmarklets easier.

Upvotes: 3

Exelian
Exelian

Reputation: 5888

Eloquent javascript has a console type window in the bottom (click the small arrow on the bottom right side). This might be what you're looking for. The exact term for what you means is an REPL, a Read-Evaluate-Print loop.

Upvotes: 0

Related Questions