Question

我有一个已经部署了数百个html页面的网站。现在我想在所有html页面中向主体添加事件监听器，例如onload和onunload。我不想手动更改它们中的每一个，所以我在想是否可以动态添加这些监听器。我的想法是编写查找正文DOM节点的javascript代码，并将侦听器添加到此节点。可能吗？（它不一定是跨浏览器的解决方案。代码将在Firefox上运行。）

谢谢！保罗

Answer 1

如果您想添加JavaScript，您最终需要以某种方式修改网站。

可能你会进行全局搜索并替换并寻找：

</head>

并将其更改为

<script type="text/javascript" src="/global.js"></script>
</head>

然后在您网站的根目录下创建一个名为global.js的文件并将其放入其中：

window.onload = function() {
   // onload code here
}

window.onunload = function() {
   // onunload code here
}

你想做什么事？如果你要添加大量的事件处理程序，那么对jQuery或其他库的建议是一个很好的建议，但是如果你只需要添加一些JS块，那么库就太过分了。

Answer 2

是的，很容易..但你怎么去那里的javascript？如果您已经在允许挂钩方法的所有页面中加载单个javascript库，则可以使用

window.onload = function() {};

和

window.onunload = function() {};

..但如果你有选择权，我会认真建议使用像jQuery这样的库来隐藏你的所有这些东西。

保罗要求澄清。这是示例代码：

var hi = function() {
  alert('hi there.');
};

var bye = function() {
  alert('bye!');
};

if(window.addEventListener) {
  window.addEventListener('load', hi, false);
  window.addEventListener('unload', bye, false);
} else if(window.attachEvent) {
  window.attachEvent('load', hi);
  window.attachEvent('unload', bye);
}

Answer 3

有两个解决方案：

您可以使用jQuery ready事件
或者您可以使用window.onload

Answer 4

嗯，你可以做以下四件事之一：

使用PHP，Python或ASP.Net等脚本语言构建这些页面的前端，增加所需的代码
使用grep和sed等工具进行全替换
在一个框架中，从中央“主页”加载提到的页面，并使用DOM操作添加所述事件监听器（尽管我认为body.onLoad无法实现这一点）
如果所有页面都已加载某些 javascript，只需将您的偶数听众扔在那里。

Answer 5

在firefox中添加事件的常规方法是obj.addEventListener（type，fn，false）。所以唯一要做的就是：

window.addEventListener('load', yourFunction, false );

没有理由为此使用jquery。

Answer 6

由于您只需要在Firefox中使用它，因此应该收听DOMContentLoaded事件（这意味着加载HTML，不包括图像）

document.addEventListener("DOMContentLoaded", function () {
    // your code here; document.body is available
}, false);

动态添加事件侦听器

6 个答案: