When I make some changes in html content using Chrome's Inspect Element editor the changes are immediately reflected. But when I make a change in Javascript code then the changes are not reflected.

Suppose on click of a button I say, alert "John is a Good boy" and When I change it to "John is a bad boy" using Inspect element(JS code) then the changes are not reflected on button click and the old text "John is a Good boy" gets displayed.

So when a page gets loaded, its not possible to edit the JS code and see the changes ? Why is it so ?

When I make some changes in html content using Chrome's Inspect Element editor the changes are immediately reflected. But when I make a change in Javascript code then the changes are not reflected.

Suppose on click of a button I say, alert "John is a Good boy" and When I change it to "John is a bad boy" using Inspect element(JS code) then the changes are not reflected on button click and the old text "John is a Good boy" gets displayed.

So when a page gets loaded, its not possible to edit the JS code and see the changes ? Why is it so ?

• javascript
• jquery
• html
• dom

• 1 The code is not reflected because it is not repiled. To do so, you could copy / paste the code into the console, or, still in your console, eval() the content of the script tag you modified. Demo – blex Commented Jul 7, 2015 at 19:37
• 1 Browsers' javascript engines run the script immediately on load of the script. When you change it in inspector and save, it only saves to your temp and when you refresh, the javascript runs the file from the domain, not your temp folder so it will always run the hosted js file not the locally saved one. HTML elements on the other hand are static elements and can be changed on the fly. CSS can be applied on the fly as well. – Liquidchrome Commented Jul 7, 2015 at 19:39

3 Answers 3

In my experience, the edits I've made to Javascript files have been reflected immediately. However, an easy fix you might try is as follows:

• Insert a breakpoint on the line you want to edit
• Reload the page (breakpoints will persist)
• Edit that line when the breakpoint is hit
• Click Continue on the debugger

If you need more information on breakpoints and the debugger, check out this link

If you want even more information on using the inspector tool, try searching through this tutorial

Altering the JavaScript of a page through the browser is considered a malicious practice. Imagine that someone removes all the logic from you login method and then has it return true;.

Malicious users could exploit your system by making targeted changes to your system. So browsers prevent you from making those changes live.

If you really wanted to, I guess you could download all the source files, make your changes and then have a browser load the project. The project should preserve your changes. Although, the webmaster probably has mechanism in place to prevent any ining requests to his server from Cross Origin (XSS). Recognizing that the edited requests are not ing from the correct origin, the server should reject and potentially try to log/track the malicious attempt.

If you want to change something that is inside a function, then you can do that by pressing control + s (on windows). that works for most games at least, like a version of Tetris that I wanted to have some fun in. I found this in the first link that @jake magill provided.