Is there any difference in JavaScript injection and bookmarklet?

Question

As per the Wikipedia article on Bookmarklets (http://en.wikipedia.org/wiki/Bookmarklet), the concept of Bookmarklets is:

Web browsers use URIs for the href attribute of the tag and for bookmarks. The URI scheme, such as http:, file:, or ftp:, specifies the protocol and the format for the rest of the string. Browsers also implement a prefix javascript: that to a parser is just like any other URI. Internally, the browser sees that the specified protocol is javascript, treats the rest of the string as a JavaScript application which is then executed, and uses the resulting string as the new page.

It says that the resulting string is used as the new page. So does that mean the original DOM that browser has is not affected by that string? But then how can I change or inject new DOM elements in the existing DOM if only the resulting string is used as a new page? Because script to alert Hello or to inject some new DOM element doesn't really return anything. They kinda work on the existing DOM.

Now, in internet explorer, apart from using Bookmarklets to execute some JavaScript on the page, I can write a BHO plugin and inject it in the following way:

        document = (HTMLDocument)webBrowser.Document; 
        var injectedJS = System.IO.File.ReadAllText("InjectedJS.js");
        var window = document.parentWindow;
        window.execScript("(function(){ " + injectedJS + " })()");

Similarly in chrome, I can write an extension to achieve the same thing:

var s = document.createElement('script');
s.src = chrome.extension.getURL("script.js");
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

How are these different? The high level questions that I have are:

1. Do these three approaches execute the JavaScript code in different environments?
2. Is there any limitation to one of them that another one doesn't have?
3. Is there any difference in the way the result of the execution is presented to the user or is reflected back in browser?
4. Is there any difference at all between the terms "JavaScript Injection" and "Bookmarklets"? Though I believe JavaScript Injection is an effect and Bookmarklets are a way to achieve that, BHO and Chrome extensions being another.
5. If assumption in 4 is correct, is there any difference in the way JavaScript is executed using BHO's execScript method or using javascript: protocol in a browser?

Answer 1

1. Do these three approaches execute the javascript code in different environments?

All of these three methods execute JavaScript code in the context of the page. When these methods are compared with each other, you can say that the JavaScript code is executed in the same environment.

Content scripts (Chrome/Opera/Firefox/Safari) run in an environment that is isolated from the web page, so looking from that perspective, the environment is indeed different.
BHOs are a tad different, because unlike the other extension platforms, the extension's language is not JavaScript, but C++, C#, ... The JavaScript code cannot directly access the BHO's native code (unless you implement such a thing yourself), so the environment is certainly "different".

2. Is there any limitation to one of them that another one doesn't have?

Bookmarklets are javascript:... URLs, and nothing more. Browser extensions can directly perform cross-origin HTTP requests, access persistent site-independent storage, etc. If you want to get similar features in a bookmarklet, you need to use an external web service.

Bookmarklets can only be active when they are manually activated by a user. Whether this is an advantage or disadvantage depends on your situation.

The maximum size of a bookmarklet is restricted by the maximum URL length, which is rather small. This limitation can be circumvented by inserting a <script src> tag in the document. The script has to be loaded first, so the execution of the code is delayed.

Bookmarklets can be used in almost every web browser, including the ones on phones and tablets (Chrome extensions can only be used in, well, desktop Chromium browsers).

3. Is there any difference in the way the result of the execution is presented to the user or is reflected back in browser?

No. In all cases, you're running code in the context of the current page. In theory, a page can replace all built-in methods (e.g. Function.prototype.call, String.prototype.replace, ..), and interfere or abuse the functionality of your script.
Possibly worth noting: The Crossrider and Kango extension frameworks implement the "content script" feature for Internet Explorer in a way that is similar to these three methods. This implies that pages can be crafted in such a way that they detect IE plugins written using these frameworks, intercept the API declaration and abuse their features.

4. Is there any difference at all between the terms "Javascript Injection" and "Bookmarklets"? Though I believe Javascript Injection is an effect and Bookmarklets are a way to achieve that, BHO and Chrome extensions being another.

There is no conceptual difference between a bookmarklet and "injected script". There are some practical differences, explained at section 2 of this answer.

(by "injected script", I assume you're referring to this method ^{I coined the term to distinguish between the types of scripts in the Chrome extensions. Opera 12- and Safari both use this term for "content scripts"}).

5. If assumption in 4 is correct, is there any difference in the way javascript is executed using BHO's execScript method or using javascript: protocol in a browser?

Besides the previously mentioned differences, no.