在腳本中加載腳本

我正在努力加載一個響應/移動頁面的最佳方式，然後我發現了一個取決於屏幕寬度取消註釋的jQuery插件。我發現它很完美，因爲我不需要額外的HTTP請求，對於移動用戶來說，它會更快。在腳本中加載腳本

但是，我偶然發現了一個問題：這個jQuery插件無法加載/渲染其他腳本。您可以在此撥弄我只是做了看：https://jsfiddle.net/g3f88q5k/

<div id="Test"> 
<!-- @media only all and (min-width:400px) 
<script> Whatever </script> 
--> 
</div>

它取消註釋我想要的部分，但是這使得Twitter的按鈕Twitter的按鈕不起作用的腳本。

如何做到這一點，如果有什麼辦法呢？

來源

2016-05-12 borbs

開箱即用的...如果你正在談論的響應則是引導今天的主角.. –

@Reddy，引導是不是這個問題的一個合適的建議，並對於大型項目來說這不是一個特別好的圖書館，因爲這是一個維護噩夢。 – zzzzBov

@Reddy我正在使用它，與隱藏的類和所有。但是，這些類仍然加載內容，只是不顯示。我想要根據屏幕大小加載內容:) – borbs

-1

你可以像這樣

<html> 
    <head></head> 
    <body> 

     <script type="text/javascript"> 
      var script = document.createElement('script'); 
      script.src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"; 
      script.onload = function() { 
       console.log($); // now it's loaded 
      }; 

      document.body.appendChild(script); 
      console.log($); // doesn't work 
     </script> 
    </body> 
</html>

我只是使用jQuery作爲一個例子

的作用，但它應該與任何工作。

來源

2016-05-12 17:17:11

我不認爲它會與我想要的。這加載腳本，對，但在Twitter按鈕的情況下......？ – borbs

可以在if語句中創建XHR（或JS代碼本身），但在XHR的情況下，您將爲多個腳本加載執行性能命中。你最好把所有的JavaScript放在一個縮小的文件中，讓它立即下載。你可以讓JS檢測最小寬度等，就像媒體查詢一樣，但可能不容易維護。

來源

2016-05-12 17:23:04

嘗試enquire.js。

通過match回調：

enquire.register("your screen media query here", { 

    match : function() { 
     //load your script here 
    } 
});

來源

2016-05-12 17:26:29

有了enquire.js，我可以加載正常的內容或只是腳本？ – borbs

正常內容是什麼意思？你可以做任何JavaScript可以做的回調，但似乎不取消註釋的HTML，:(所以，這取決於。 –

像，如果我想要顯示圖像，或有「常規的HTML」，在某些點上，顯示一個腳本（在我的情況下，微博按鈕; D） – borbs

在腳本中加載腳本

回答

相關問題