如何動態導入CSS的骨幹？

我正在開發一個應用程序，使用骨幹，下劃線和jquerymobile。繼jqmobile的方式，我有它加載在特殊div s個標籤每一個訪問的頁面，與屬性data-role="page"標記索引頁。對於每個頁面，我都有其相應的樣式文件（或嵌入在style html標籤中的代碼片段）。我的問題是我的風格東西的名字開始碰撞。其他的事情是，我不喜歡爲每個頁面加載不必要的樣式文件。是否有任何方式動態導入當前頁面所需的CSS？這樣做的如何動態導入CSS的骨幹？

來源

2012-12-07 Throoze

我完成正是你問什麼用RequireJS和RequireCSS插件。

這裏是我的觀點一個片段：7

define([ 
    'jquery', 
    'underscore', 
    'backbone', 
    'views/company/form', 
    'text!templates/company/company.html', 
    'css!../../../css/company/company', 
], function($, _, Backbone, Form, pageTemplate) { 

    var Page = Backbone.View.extend({ 
    ... 
    }); 

    return Page; 

});

線，'css!../../../css/company/company'是在CSS文件成爲加載此觀點的要求。

一旦company.css樣式表被加載，它在瀏覽器中，即使其他的「頁面」負載，因爲沒有實際的頁面刷新。因此，我有我的主要頁面訪問量切換<html>元素類：

// remove any old route-* classes existing on the html element 
$('html').removeClassRegEx(/^route-.*/); 
// add in the company's top-level class name 
$('html').addClass('route-company');

而對於company頁我所有的特定頁面的樣式被限定在.route-company類。

您可以找到jQuery plugin removeClassRegEx here。

來源

2012-12-08 03:05:35 bejonbee

一種方法是使用jQuery的（你90％已經與骨幹網使用），其load或get AJAX功能，或什麼的，加上回調。

然後，如果需要，您可以從骨幹應用程序調用這些函數，並將該css內的<style>標籤簡單地插入到文檔中作爲模板。

或者我覺得也有專門的jQuery函數。

我能想到這樣做會與require.js的，它的插件另一種方式（它有text插件，我相信，這也將讓你加載你的JavaScript模板）。

來源

2012-12-07 04:47:40

如何動態導入CSS的骨幹？

回答

相關問題