从书签运行时，Bookmarklet 不起作用，但从控制台运行时可以

Question

我正在尝试创建一个书签，它将在网页上的文本区域中插入一些文本（网页供内部使用，因此没有链接的意义）。

这是我尝试过的 JavaScript 代码示例：

(function(){document.getElementById("textareaID").value="Some text";})();

我想指出的是，我尝试了不同的元素选择器（byClass、查询...）和不同的属性（甚至 tabindex）以获得相同的结果。还在 Chrome 和 IE11 中进行了尝试。

因此，出于某种奇怪的原因，当我从控制台（或作为片段）运行它时，我的 JavaScript 会运行，但当我尝试从书签菜单运行它时，我收到错误“无法设置 null 的属性‘值’”。

我尝试自己创建一个书签

javascript:(function(){document.getElementById("textareaID").value="Some text";})();

并尝试使用在线书签创建器对特殊字符进行编码

javascript:(function(){document.getElementById(%22textareaID%22).value=%22Some%20text%22;})();

但没有运气。

小书签肯定可以在页面上使用（尝试使用警报“Hello”），但我似乎在“捕获”元素时遇到问题。我还注意到某些元素的 ID 有时会发生变化（但不确定为什么），但我总是检查以确保我尝试使用的 ID 存在，或者我使用一些固定值，如 tabindex。此外，正如我所说，它在从控制台运行时有效，所以我不可能以某种方式搞砸它......或者我可以吗？

Answer 1

所以问题出在执行上下文上。因为元素的 ID 正在发生变化，所以我必须在从控制台运行 js 之前检查它们，并检查将执行上下文从顶部更改为元素所在的位置。这就是为什么它是从控制台而不是从书签工作的......

因此，要写入特定框架内的文本框：

let Iframe =  document.getElementById('yourIframe').contentWindow.document
let value = Iframe.getElementById("textboxID").value = "Some Text"

之后唯一剩下的就是将所有内容包装在 a 中javascript:(function(){..your code here..})();以创建一个书签。