如何在文档完全加载之前但在元素存在之后执行 javascript？答案

【问题标题】：How to execute javascript before document fully loads but after element is there?如何在文档完全加载之前但在元素存在之后执行 javascript？
【发布时间】：2014-03-27 20:42:10
【问题描述】：

我正在尝试为 google.com 编写一个非常简单的用户内容脚本，但问题是 google 的源代码很长。我想在元素在文档中的那一刻，但在整个文档加载之前，在 javascript 中执行代码。

基本上，我不想在页面的其余部分加载之前更改图像的来源。我还想在具有特定 id 的某个其他 div 中修改 html。但同样，我不想等到文档的其余部分加载完毕后才开始执行。

我怎样才能做到这一点？我正在使用 jquery。

【问题讨论】：

检查stackoverflow.com/questions/4057236/…
你能把这个脚本直接放在元素下面吗？还是您只能将脚本放在固定位置（如）并需要检测元素何时可用？
会不会是 XY 问题？ meta.stackexchange.com/questions/66377/what-is-the-xy-problem
@EvanKennedy 后者。
@A.Wolff 我不这么认为，因为内容脚本就是脚本。我必须使用 javascript。

标签： javascript jquery html google-chrome-extension

【解决方案1】：

试试这个：

var element = $([TagName]) || document.getElementsByTagName([TagName])[[occurance]];

function doSomething() {
  // Do some magic.
}

element.addEventListener("load", doSomething, false); // Notice no brackets after the function call.

这会为元素添加一个事件监听器，并等待它完全加载，直到它运行函数 (doSomething())。

希望这会有所帮助。

【讨论】：

代码执行时元素不存在。