一种常见的解决方法是将 CSS 文件存储在本地。这种方法可以避免依赖外部服务器,减少网络问题的影响。下面是一个例子,演示如何在 CSS 加载失败时,从本地加载 CSS。
function loadLocalCSS() { var cssPath = "path/to/local.css"; var link = document.createElement("link"); link.rel = "stylesheet"; link.type = "text/css"; link.href = cssPath; document.head.appendChild(link); }
在上面的代码中,大家首先尝试加载外部 CSS 文件,如果发生错误,就会触发 `onerror` 事件,调用 `loadLocalCSS()` 函数。这个函数会创建一个 “ 元素,将其 `rel` 属性设置为 “stylesheet”,`type` 属性设置为 “text/css”,`href` 属性设置为本地 CSS 文件路径。然后,将这个元素添加到文档头部即可。
另外,在使用这种方法时,需要注意 CSS 文件的路径。如果 CSS 文件的路径不正确,仍然会出现加载失败的情况。此外,还需要确保本地的 CSS 文件和外部服务器的 CSS 文件是相同的,否则可能会出现排版不一致的问题。
总之,当 CSS 加载失败时,使用本地 CSS 文件可以是一个快速而有效的解决方法。大家可以通过在Link标签上设置onerror事件检测是否加载成功,如果失败则加载本地的CSS文件。