css链接标记的async = true
cly*_*yfe 27 javascript css html5 dom
在HTML5中,脚本标签可以通过异步加载 async=true
<script src="index.js" type="text/javascript" async="true"></script>
是否有CSS资源的等价物？就像是:
<link rel="stylesheet" type="text/css" async="true" href="style.css">
理由是让浏览器加载css并缓存它,以便以后的请求,但让其余的进程解除阻塞.比如,一个闪屏.
Gal*_*lit 27
今天最好的方法,在下面的文章中描述:
没有JavaScript的"异步"CSS
我敦促所有读者 - 阅读文章,因为它深入研究已知的"黑客"和变通方法.
"看起来这个技巧导致Chrome和Firefox更早启动机身,它们根本不会阻挡身体样式表."
<head>
<!--[if IE]>
<link rel="stylesheet" href="style.css">
<![endif]-->
</head>
<body>
<!--[if !IE]> -->
<link rel="stylesheet" href="style.css" lazyload>
<!-- <![endif]-->
</body>
该文章还包含基准:
Ved*_*kar 22
我认为这不会起作用.
但我们可以使用JS来做到这一点:
var resource = document.createElement('link');
resource.setAttribute("rel", "stylesheet");
resource.setAttribute("href","path/to/cssfile.css");
resource.setAttribute("type","text/css");
var head = document.getElementsByTagName('head')[0];
head.appendChild(resource);
我认为它会实现你想要做的事情.
如果你不想javascript看看:如何在不使用JavaScript的情况下异步加载CSS？
希望它会有所帮助.
- @RPM怎么样？根据OP,他希望加载`css` async ie,其余的`html`和这个js`script`也是一样的,同样也标记了`javascript`.如果我错了,请纠正我. (11认同)
- 这绝对与这个问题毫无关系. (3认同)
- 非常感谢！+1以使用本机JavaScript (3认同)
- 谢谢。这就是我最终做的事情，它适用于我的情况（急切加载以缓存它）。 (2认同)
加载 css 而不阻塞渲染
<link rel="preload" media="(min-width:801px)" href="styledesk.css" as="style">
<link rel="stylesheet" media="(min-width:801px)" href="styledesk.css">
更多信息：https : //developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content
- @Vadorequest如果这是我同意的限制，但这似乎是一个完美的情况，如果您使用的是较旧的浏览器，它可以工作，但它在当前浏览器上工作得更好。在几乎所有情况下，这在我的工作中都是比尝试维护一个尝试适应所有旧浏览器的解决方案更好的选择。 (3认同)
| 归档时间： |
|
| 查看次数： |
39737 次 |
| 最近记录： |