正如标题所说,我想等到 html 被解析,并且所有样式表都被加载,因为我需要使用currentsyle
. 但是,我不想等待图像。所以我不能使用load
事件,因为它等待图像。而且我不能使用该DOMContentLoaded
事件,因为它不等待样式表。我也不能使用document.body.appendChild
在文档末尾添加脚本标记,因为该脚本是在假设页面上的 javascript 被禁用的情况下运行的。
真的没有等待样式的事件吗?
正如标题所说,我想等到 html 被解析,并且所有样式表都被加载,因为我需要使用currentsyle
. 但是,我不想等待图像。所以我不能使用load
事件,因为它等待图像。而且我不能使用该DOMContentLoaded
事件,因为它不等待样式表。我也不能使用document.body.appendChild
在文档末尾添加脚本标记,因为该脚本是在假设页面上的 javascript 被禁用的情况下运行的。
真的没有等待样式的事件吗?
GM 脚本有三个可能run-at
的值 - 括号中是相应的 document.readyState
document.readyState === 'loading'
)document.readyState === 'ineractive'
)document.readyState === 'complete'
)这些是脚本唯一可用的注入点
在开始/结束时 - 还没有加载外部资源,所以对于你想要的来说太早了
在空闲时,所有外部资源都已加载,所以为时已晚
好的,你知道这一切,但我正在为其他未来的读者添加它
如果您在文档端加载脚本,则可以load
向所有人添加侦听<link rel="stylesheet"
器
Promise.all(Array.from(document.querySelectorAll('link[rel="stylesheet"]'), ss => new Promise(resolve => {
const href = ss.href;
const fulfill = status => resolve({href, status});
setTimeout(fulfill, 5000, 'timeout');
ss.addEventListener('load', () => resolve('load'));
ss.addEventListener('error', () => resolve('error')); // yes, resolve, because we just want to wait until all stylesheets are done with, errors shouldn't stop us
}))).then((results) => {
// results is an array of {href:'some url', status: 'load|error|timeout'}
// at this point stylesheets have finished loading
});