制作一个 Google Chrome 扩展,需要在加载 head 后运行脚本,因为 head 中有脚本,我需要它们运行。在加载 DOM 之前,因为其中有一个我需要击败的内联脚本。
我该怎么做?如何检测头部加载时间?
最佳答案
当您注入(inject)您的内容脚本时,您可以在 list 中将“run_at”参数声明为“document_start”,这些文件在来自 css 的任何文件之后注入(inject),但在构建任何其他 DOM 或运行任何其他脚本之前.可以找到更多信息here .
{
"name": "My extension",
...
"content_scripts": [
{
"matches": ["http://www.google.com/*"],
"css": ["mystyles.css"],
"js": ["jquery.js", "myscript.js"],
"run_at": "document_start"
}
],
...
}
*已编辑,添加了示例。 mutations event之一可以使用类型。
例子
list .json
{
"name": "Content Script test",
"version": "0.1",
"description": "Content Script test",
"content_scripts": [
{
"matches": ["http://*/*"],
"js": ["cs.js"],
"run_at": "document_start",
"all_frames": true
}
]
}
cs.js
document.addEventListener('DOMSubtreeModified', OnSubtreeModified, false);
function OnSubtreeModified(event) {
console.log('Hello from extension!');
document.removeEventListener('DOMSubtreeModified', OnSubtreeModified, false);
}
test.html(在网络上的某个地方)
<html>
<head>
<script>
alert('Hello from Web!');
</script>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
结果
您将按顺序收到两个警报:
- 来自网络的问候!
- 分机你好!
关于javascript - 如何在加载头部之后但在 DOM 之前立即运行脚本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2979047/