在多框架頁面上只加載jQuery一次

我的應用程序中的一個關鍵屏幕涉及一個HTML頁面，其中有幾個iframe執行各種功能。所有這些都需要訪問jQuery。爲了加速加載時間並減少HTTP流量（儘管我知道緩存可以幫助實現這一點），但如果jQuery代碼本身只加載一次，那將會很好。如果我的網頁是像這樣在多框架頁面上只加載jQuery一次

<html> 
    <head> 
     <script src="jquery-1.5.js" type="text/javascript"></script> 
    </head> 
     <body> 
     <iframe src="other.html"></iframe> 
     <div id="foo"> ... stuff here ... </div> 
     </body> 
</html>

內。然後other可以參考我parent.$('#foo')但會參考父母的「福」元素，而不是孩子的。有沒有辦法在子文檔或其中的元素上使用父級的jQuery「實例」？

來源

2011-06-30 Dan

你試過=父[ 'jQuery的']'的'$ 'iframe'？ – glortho

你試過：

var $ = window.parent.$; 
$('#foo'); // parent's frame's #foo, is the same as "window.parent.$('#foo');"

和：

var $ = window.parent.$; 
$('#foo', document); // this frame's #foo because the current document is given as context

來源

2011-06-30 18:19:18

我很確定我在我的問題中解決了這個問題。 '父母。$（'＃foo'）'指父母。我想提到這個孩子。 – Dan

不，你是誤解。父母。$（'foo'）是父母的dom。但我說你需要將jquery複製到內部iframe和do $（'foo'）。哪個應該尋找內在的dom。請先嚐試一下。 –

我已更新，所以您可以看到我在說什麼。 $無非就是jquery庫，它在你所在的框架上工作。 –

確保每個IFRAME都引用完全相同的jquery版本。它應該只加載一次並由瀏覽器緩存。 IFRAMES無法訪問父母的腳本。

您可能還想考慮使用CDN for Jquery（如Google's CDN）來提高性能。

來源

2011-06-30 18:10:51 Keltex

+1最佳解決方案 –

我會對此做一些實驗。這不是我認爲我看到的行爲，但可能是我在瀏覽器中強行禁用了緩存。 – Dan

我不知道它是否不緩存它，因爲所有iframe同時發送javascript請求。好奇也在這裏。 –

我們與解決它：

var window.jQuery = window.$ = function(selector, context) { 
    return window.parent.jQuery(selector, context?context:window.document) 
}

來源

2017-08-01 08:49:57 Marc

在多框架頁面上只加載jQuery一次

回答

相關問題