前端組件化的三種方案：

1.預編譯語言
在開發階段，用更完善的第三方程序語言，生成html，css，js代碼。
缺點：css有sass，less；js有CoffeeScript，TypeScripty；HTML呢？
優勢：若是語言有缺陷，那我就再套一層語言來隱藏這些缺陷。
未來：聽說hex語言...

 

2.css和html寫在html文件裏

而後以

{
type:"get",
dataType:"text",
url:"module.html",
async:true,
cache:true
}

這個配置，ajax get請求html，
再把請求過來的文本，轉換爲dom節點便可。
缺點：請求過多。
優勢：html代碼和css代碼修改起來方便。
未來：多個http請求能夠在同一個tcp鏈接進行，瀏覽器的頁面緩存策略升級。這個方案不錯。

 

3.css和html，js都寫在一個js文件

方式一，

var $html = $('<div class="moduleHtml"></div>'),
$css = $('<style>.moduleHtml{}</style>');

$("head").append($css);
$("body").append($html);

 

方式二，
由於dom是一個樹形結構，json也是一個樹形結構，因而能夠用json生成html。
由於css是一個層疊結構，json也能表達層疊結構，因而能夠用json生成css。
貌似，好像，react就是這麼作。

缺點：html代碼和css代碼修改起來不方便。
優勢：單文件闖關東。
未來：未來就是當下。