如何動態地導入JavaScript和CSS文件

我要導入一個給定的CSS或依賴JavaScript文件OS某些情況下，在我的servlet我有：如何動態地導入JavaScript和CSS文件

 

protected void doPost(...) 
{ 
    if(condition) 
    { 
    //import some javascript or css file here 
    } 

}

我需要這個行爲，因爲我有太多的文件導入和文件名稱可能因條件而異。這可能嗎？

來源

2010-03-20 marcosbeirigo

排序，是的。

boolean condition = evaluateItSomehow(); 
request.setAttribute("condition", condition); 
request.getRequestDispatcher("/WEB-INF/page.jsp").forward(request, response);

然後在page.jsp使用JSTLc:if：

<head> 
    <c:if test="${condition}"> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
     <script type="text/javascript" src="script.js"></script> 
    </c:if> 
    ... 
</head>

更新：因爲你似乎有這個一個以上的文件，你甚至可以使由只設置所需的文件名更靈活後綴（或前綴，或甚至整個名稱，你喜歡什麼）：

String suffix = evaluateItSomehow(); 
request.setAttribute("suffix", suffix); 
request.getRequestDispatcher("/WEB-INF/page.jsp").forward(request, response);

和

<head> 
    <link rel="stylesheet" type="text/css" href="style_${suffix}.css"> 
    <script type="text/javascript" src="script_${suffix}.js"></script> 
    ... 
</head>

如果設置suffix到例如"foo"，這將加載style_foo.css和script_foo.js。我認爲這給了足夠的新見解。

來源

2010-03-20 18:06:55 BalusC

hello :)使用此方法時，bwoser緩存有任何問題嗎？如果我想加載相同的頁面，在不同的條件下，使用多種css？請問客戶端瀏覽器緩存的CSS？ – thekucays 2017-01-10 06:57:00

您是否試圖將Javascript和CSS插入到dom中？我會從客戶那邊做到這一點。我的意思是，通過明確寫出<script...>或<link...>的代碼，它可能是。更好的方法是將一些東西發回給客戶端，告訴它添加樣式表或Javascript。

然後你就可以動態地添加它像這樣：

如果這並不需要動態地進行，這是更容易。只需設置一個標誌並在您的JSP或ASP中，檢查標誌的狀態。在條件標籤內，您將爲您的CSS和Javascript添加代碼。但是，我從你的問題中假設它是前者。

來源

2010-03-20 18:06:53

function loadjscssfile(filename, filetype) { 
      if (filetype == "js") { //if filename is a external JavaScript file 
       // alert('called'); 
       var fileref = document.createElement('script') 
       fileref.setAttribute("type", "text/javascript") 
       fileref.setAttribute("src", filename) 
       alert('called'); 
      } 
      else if (filetype == "css") { //if filename is an external CSS file 
       var fileref = document.createElement("link") 
       fileref.setAttribute("rel", "stylesheet") 
       fileref.setAttribute("type", "text/css") 
       fileref.setAttribute("href", filename) 
      } 
      if (typeof fileref != "undefined") 
       document.getElementsByTagName("head")[0].appendChild(fileref) 
     }

調用此javascript函數來動態加載css和js文件。在「文件名」參數中傳遞具有名稱的完整文件路徑。

來源

2012-05-10 11:21:11 Talha

如何動態地導入JavaScript和CSS文件

回答

相關問題