javascript - JavaScript注入(inject)和书签有什么区别吗？

Question

根据关于 Bookmarklets 的维基百科文章 ( http://en.wikipedia.org/wiki/Bookmarklet )，Bookmarklets 的概念是:

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.

它表示生成的字符串用作新页面。那么这是否意味着浏览器拥有的原始 DOM 不受该字符串的影响？但是，如果仅将结果字符串用作新页面，我如何才能在现有 DOM 中更改或注入(inject)新的 DOM 元素？因为用于提醒 Hello 或注入(inject)一些新 DOM 元素的脚本实际上并没有返回任何内容。他们有点在现有的 DOM 上工作。

现在，在 Internet Explorer 中，除了使用 Bookmarklets 在页面上执行一些 JavaScript 之外，我还可以编写一个 BHO 插件并通过以下方式注入(inject)它:

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

类似在chrome中，我可以写一个扩展来实现同样的事情:

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);

它们有什么不同？ 我的高级问题是:

1. 这三种方法是否在不同的环境中执行 JavaScript 代码？
2. 其中一个是否有其他限制没有的限制？
3. 执行结果呈现给用户或反射(reflect)在浏览器中的方式有​​什么不同吗？
4. 术语“JavaScript 注入(inject)”和“Bookmarklets”之间有什么区别吗？尽管我相信 JavaScript 注入(inject)是一种效果，而 Bookmarklet 是实现该效果的一种方式，但 BHO 和 Chrome 扩展是另一种方式。
5. 如果 4 中的假设是正确的，那么在浏览器中使用 BHO 的 execScript 方法或使用 javascript: 协议(protocol)执行 JavaScript 的方式有什么不同吗？

Answer 1

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

所有这三种方法都在页面上下文中执行 JavaScript 代码。当这些方法相互比较时，您可以说 JavaScript 代码是在相同的环境中执行的。

内容脚本(Chrome/Opera/Firefox/Safari)运行在与网页隔离的环境中，所以从那个 Angular 来看，环境确实不同。
BHO 有点不同，因为与其他扩展平台不同，扩展的语言不是 JavaScript，而是 C++，C#，...... JavaScript 代码不能直接访问 BHO 的 native 代码(除非你自己实现这样的东西)，所以环境肯定是“不一样”的。

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

小书签是 javascript:...网址，仅此而已。浏览器扩展可以直接执行跨源 HTTP 请求，访问持久的站点独立存储等。如果你想在书签中获得类似的功能，你需要使用外部 Web 服务。

Bookmarklet 只有在被用户手动激活时才能激活。这是优势还是劣势取决于您的情况。

小书签的最大大小受 maximum URL length 限制。 ，这是相当小的。可以通过插入 <script src> 来规避此限制。文档中的标签。必须首先加载脚本，因此代码的执行会延迟。

Bookmarklets 几乎可以在所有网络浏览器中使用，包括手机和平板电脑上的浏览器(Chrome 扩展只能用于桌面 Chromium 浏览器)。

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

没有。在所有情况下，您都在当前页面的上下文中运行代码。理论上，页面可以替换所有内置方法(例如 Function.prototype.call、String.prototype.replace、..)，并干扰或滥用脚本的功能。
可能值得注意:Crossrider 和 Kango 扩展框架以类似于这三种方法的方式实现 Internet Explorer 的“内容脚本”功能。这意味着可以以检测使用这些框架编写的 IE 插件、拦截 API 声明并滥用其功能的方式制作页面。

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.

小书签和“注入(inject)脚本”在概念上没有区别。本答案的第 2 部分解释了一些实际差异。

(通过“注入(inject)的脚本”，我假设您指的是 this method ^{我创造了这个术语来区分 Chrome 扩展中的脚本类型。Opera 12- 和 Safari 都使用这个术语来表示“内容脚本”}).

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?

除了前面提到的差异之外，没有。