{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 戒情不戒烟 的问题《Is ordering of <link rel=“stylesheet” …> and》','https://www.manongdao.com/q-1254444.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
(I apologize if this is an extremely basic question. I'm a bit of an HTML noob.)
In HTML5, is the relative ordering within the <head> element, of elements having the form <link rel="stylesheet" type="text/css" ...> and elements having the form <script ...></script> at all significant, either semantically or performance-wise (or in some other way)?
For example, assuming a (possibly mythical) "fully HTML5-compliant browser", are there situations in which the following two snippets would produce "different results" (i.e., different appearance, or noticeable different performance, or different behavior, etc.)?
<!DOCTYPE html>
<html>
<head>
<!-- ... -->
<link rel="stylesheet" type="text/css" href="foo.css"/>
<script src="foo.js"></script>
<!-- ... -->
</head>
<!-- ... -->
</html>
<!DOCTYPE html>
<html>
<head>
<!-- ... -->
<script src="foo.js"></script>
<link rel="stylesheet" type="text/css" href="foo.css"/>
<!-- ... -->
</head>
<!-- ... -->
</html>
(<!-- ... --> denotes code that is both correct and common to both cases. IOW, the only difference between the two cases is the ordering of the <link...> and <script>...</script> elements within the <head>...</head> element.)
In the general case, the order should be assumed to be significant. Because it can be. JavaScript code may, for example, try to access a
linkelement, and then it matters whether thelinkelement appears before thescriptelement (in which case it exists in the DOM when the script is executed).In terms for performance... include CSS files in the header and js files at the bottom of the page...
In terms of order the order of css files and js files matter... in css file if the same rule is present in multiple files the later once will get precedence... in js file the depended files should be included first
It is always better you include style sheet in the header and the scripts at the bottom because, users have to wait till the JavaScript finishes loading, tags block parallel downloads.
please look the following links\ Is the recommendation to include CSS before JavaScript invalid?
To increase the performance of html page load, it is recommended that you use Javascript
tagin the end of the body andcssrule in thehead. Precedence need to be maintain when otherscriptorcssis referenced in one of the file which should be there before the file which is referencing it.We can consider a simple example that.
jquery.jsfile always be at top of the othesjsfiles because, other files rely on thatjqueryfile.It should be noted that scripts are interpreted, so there ordering is important.
No, there is no difference.
The only thing you should consider is putting your
<script>tags at the bottom of the<body>. For more information regarding this issue read this article by Yahoo.Only one I can think of is the meta tag for IE...
For IE to make use of that one, it has to be the first item in the head (AFAIK)...