Dea*_*rns 17 css jquery asynchronous head
我正在异步地为我正在构建的项目添加一些脚本和样式表,并希望将样式表全部组合在HEAD中.
<head>
<title>home</title>
<meta charset="utf-8">
<link rel="Shortcut Icon" type="image/ico" href="/img/favicon.png">
<!-- STYLES-->
<link rel="stylesheet" href="/css/fonts-and-colors.css" type="text/css" media="screen">
<link rel="stylesheet" href="/css/layout.css" type="text/css" media="screen">
<!-- JS-->
<script type="text/javascript" async="" src="/js/light-box.js"></script>
<script type="text/javascript" src="/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/js/grade-button.js"></script>
<script>
$(document).ready(function() {
// some code
});
</script>
<link rel="stylesheet" href="/css/masterBlaster.css" type="text/css" media="screen">
</head>
Run Code Online (Sandbox Code Playgroud)
我目前正在使用
$("head").append("<link rel='stylesheet' href='/css/masterBlaster.css' type='text/css' media='screen'>");
Run Code Online (Sandbox Code Playgroud)
哪个工作正常,但它将它添加到我的HEAD部分的底部,如示例中所示.
我的OCD想要在我的第一个样式链接之前或在最后一个样式链接之后添加它.
谢谢你的期待.
Cur*_*urt 35
这将把新元素放在元素中link
的最后一个之后.link
head
$("head link[rel='stylesheet']").last().after("<link rel='stylesheet' href='/css/masterBlaster.css' type='text/css' media='screen'>");
Run Code Online (Sandbox Code Playgroud)
但是,如果您还没有link
到位,则不会添加新内容link
.因此,您应该先检查一下:
var $head = $("head");
var $headlinklast = $head.find("link[rel='stylesheet']:last");
var linkElement = "<link rel='stylesheet' href='/css/masterBlaster.css' type='text/css' media='screen'>";
if ($headlinklast.length){
$headlinklast.after(linkElement);
}
else {
$head.append(linkElement);
}
Run Code Online (Sandbox Code Playgroud)
我的OCD想要在我的第一个样式链接之前或在最后一个样式链接之后添加它.
您应该确定link
将要放置的确切位置.有可能不同的位置可能会覆盖现有的样式.
归档时间: |
|
查看次数: |
45063 次 |
最近记录: |