訂購CSS/JavaScript外部文件的最佳方式包括

什麼是包含CSS外部文件的最佳方式？從一般到具體還是相反？訂購CSS/JavaScript外部文件的最佳方式包括

用Rails 3.1更確切地說，產生的默認application.css（無薩斯）包含：

/* 
*= require_self 
*= require_tree . 
*/

它從特殊到一般，所以我想，如果我想補充的jQuery UI主題，例如，最好的是：中

/* 
*= require_self 
*= require_tree . 
*= require jquery-ui/smoothness/jquery-ui-1.8.16.custom.css 
*/

代替：

/* 
*= require jquery-ui/smoothness/jquery-ui-1.8.16.custom.css 
*= require_self 
*= require_tree . 
*/

我問這個questio因爲我知道，例如在C++中，建議從最具體的到最一般的。

同樣的問題代表的.js包括，在默認情況下Rails會（無CoffeeScript的）：

//= require jquery 
//= require jquery_ujs 
//= require_tree .

這似乎走了相反的：從一般到特殊。

Rails開發者是否有意選擇默認排序，還是僅僅是隨機的？如果從vue的技術角度來看沒有可取的方法，通常使用的約定是什麼？

來源

2011-10-11 tanguy_k

快速的回答是，在次網站environament它 - 通常 - 從一般到特定 –

CSS必須先包含在通用規則中，然後再包含更具體的規則。這允許更具體的規則總是覆蓋一般規則（在您希望發生這種情況的情況下）而不必明確地管理CSS specificity。

所以，如果你有這兩個CSS規則：

// general rule 
.subitem {color: blue;} 

// more specific rule 
.currentitem {color: red;}

而且，你有HTML這樣的：

<ul> 
    <li class="subitem">Item</li> 
    <li class="subitem currentitem">Item</li> 
    <li class="subitem">Item</li> 
    <li class="subitem">Item</li> 
</ul>

你會希望確保爲.currentItem的更具體的規則來在.subitem的更一般規則之後，以便.currentitem規則在您希望的時候生效。

JavaScript文件必須包含在適當的依賴順序中。例如，如果您的JavaScript文件B在其初始化代碼中使用了文件A中的函數，則文件A必須包含在文件B之前。如果兩個JavaScript文件沒有初始化依賴關係（例如，它們不會在彼此之間調用函數初始化），那麼它們可以以任何順序。在JavaScript文件中，您應該確保全局名稱空間或特定命名空間中的任何函數都不會在多個文件中具有相同的名稱。如果是這樣，最後一個將被包括在內。一般來說，你不應該依賴這種行爲，但應該刪除具有相同名稱的衝突函數。

來源

2011-10-11 22:08:37 jfriend00

您可以在您定義的上下文中定義*更具體*隸？ –

那麼如果'.subitem'被添加到'.currentitem'後的頁面上，它會覆蓋'.currentitem'？ –

我在CSS一側添加的一件事是，您應該通過執行'.subitem.currentitem'來強制執行特定操作，而不是依賴順序。這種「級聯」是CSS的用途:) – mtyson

-1

我在CSS一側添加的一件事是，您應該通過執行.subitem.currentitem來強制執行特定操作，而不是依賴順序。這種'級聯'是CSS的作用:)

在大型應用程序中，取決於順序會變得棘手。

此外，在JS的情況下，如果定義了多次，該命令將影響分配給標識符的內容。

來源

2011-10-11 22:11:17 mtyson

包括CSS文件的CSS：

@import "myCSSfile.css";

包括CSS從HTML：

<link href="myCSSfile.css" rel="stylesheet" type="text/css">

包括CSS從JavaScript：

document.getElementByTagName('head')[0].innerHTML += 
    '<link href="myCSSfile.css" rel="stylesheet" type="text/css">';

來源

2011-10-11 22:17:29

OP不要求*如何*包含文件... –

訂購CSS/JavaScript外部文件的最佳方式包括

回答

相關問題