首先,我使用以下代码加载外部JavaScript文件(它将ext_chat.js
脚本源附加到当前DOM):
var protocol = ('https:' == document.location.protocol ? 'https://' : 'http://');
(function(d, t, p) {
var g = d.createElement(t),
s = d.getElementById('Chat_Script');
g.src = p + 'mydomain.lc/js/ext_chat.js';
s.parentNode.insertBefore(g, s.nextSibling);
}(document, 'script', protocol));
在ext_chat.js
内。这里我包括CSS文件:
function r(f) {
/in/.test(document.readyState) ? setTimeout('r(' + f + ')', 9) : f()
}
r(function () {
includeCSSfile(getBaseUrl() + '/css/ext_chat.css')); // getBaseUrl() gives correct url
});
function includeCSSfile(href) {
var head_node = document.getElementsByTagName('head')[0];
var link_tag = document.createElement('link');
link_tag.setAttribute('rel', 'stylesheet');
link_tag.setAttribute('type', 'text/css');
link_tag.setAttribute('href', href);
link_tag.setAttribute('media', 'screen');
head_node.appendChild(link_tag);
}
首次加载时,CSS文件包含正常。第一次加载页面后,不会反映ext_chat.css
文件的所有更改,而是使用缓存文件。
如何在每次加载页面时强制重新加载CSS文件,而不是引用缓存的文件?
答案 0 :(得分:2)
首先,不要使用setTimeout
的评估版本。请改用.bind
。
/in/.test(document.readyState) ? setTimeout(r.bind(null, f), 9) : f()
现在,为了避免文件缓存,您应该将随机查询字符串附加到URI的末尾。通常,您会看到?v=123456789
或其他相似之处。在这种情况下,我们可以使用时间戳。
r(function () {
includeCSSfile(getBaseUrl() + '/css/ext_chat.css?v=' + Date.now())); // getBaseUrl() gives correct url
});
阅读材料: