前言
為了減少請求數量被盈,嵌入資源到 html析孽、js、css 文件中只怎。
嵌入到html中
采用資源鏈接加?__inline
的方式
html中嵌入圖片base64
<img title="fis3 logo" src="images/logo.gif?__inline"/>
html中嵌入樣式文件
<link rel="stylesheet" type="text/css" href="demo.css?__inline">
html中嵌入腳本資源
<script type="text/javascript" src="demo.js?__inline"></script>
html中嵌入頁面文件
<link rel="import" href="demo.html?__inline">
嵌入到js中
在js中袜瞬,使用編譯函數 __inline() 來提供內容嵌入能力。
在js中嵌入js文件
__inline('demo.js');
在js中嵌入圖片base64
var img = __inline('images/logo.gif');
在js中嵌入其他文本文件
var css = __inline('a.css');
嵌入到css中
與html類似身堡,添加?__inline
在css文件中嵌入其他css文件
@import url('demo.css?__inline');
在css中嵌入圖片的base64
.style {
background: url(images/logo.gif?__inline);
}
代碼
https://github.com/hans007/JavaScriptCodes/tree/master/fis3/inline