需要JQuery的第三方網站服務
[英]3rd party website service which requires JQuery
問題描述
我正在組合一項提供一些跟蹤/分析樣式功能的服務，並且計划將其提供給任何用戶，使其包括在他們的網站上，他們可以在其中粘貼對外部javascript文件的引用。 JavaScript代碼當前依賴於JQuery，因為它以這種方式進行編碼的速度更快，更容易且更健壯，但是我現在不確定如何最好地在用戶網站上包含此引用-使用該服務的某些網站可能具有JQuery，有些可能沒有，而有些則可能具有不同的版本。 這里有最佳實踐嗎？ 我提出的選擇：
- 在外部JS文件中包含帶有自定義JQuery別名的縮小JQuery（可能僅具有我需要的功能的自定義構建）
- 從外部JS文件加載Jquery（再次使用自定義JQuery別名）
- 使用條件加載器（例如yepnopejs）來確保已安裝JQuery
- 記錄安裝JQuery的要求，並由用戶自行確定以確保它存在並且兼容版本
我對3的擔憂是，將來的JQuery版本可能不兼容（盡管這不太可能，因為它只是使用的核心功能）。 我也想避免使用4，因為用戶可能不那么技術，任何問題都可能使他們完全無法使用此服務
我還錯過了其他解決方案嗎？
2 個解決方案
解決方案1
2 已采納 2013-05-15 09:38:16
您可以使用一個骯臟的把戲-jQuery具有一個名為define的函數的jsonp回調，以便它可以在AMD上正常使用。 您可以使用define回調作為jsonp回調來運行依賴jQuery的代碼：
<html>
<head>
<title>Maybe jQuery</title>
</head>
<body>
<div id=status>jQuery loading...</div>
<!--<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>-->
<script>
function jQueryReady() {
// Place your on-jQuery-load statements here
$('#status').text('jQuery loaded.');
}
if (!window.jQuery) {
define = jQueryReady;
define.amd = { jQuery: true };
var script = document.createElement('script');
script.src = '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js';
script.async = true;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(script, s);
} else {
jQueryReady();
}
</script>
</body>
</html>
演示： http ： //brass9.com/test/maybe-jquery/
由於您的問題是說您正在可能基本上具有任何作用的第三方網站上使用此代碼，因此我對答案做了一些修改，以確保此代碼對頁面上的現有庫造成（較少）危害-實際上仍然會危害像require.js這樣的庫（如果require已加載而jQuery尚未加載），則完全可以實現異步。 我稍后會更新以解決此問題。
先前的答案（不適用於David所說的）：
<script>
if (!window.jQuery) {
var script = document.createElement('script');
script.src = '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(script, s);
}
</script>
<script>
// Work with jQuery as needed
</script>
解決方案2
0 2013-05-15 09:13:35
這是一個有關如何在需要時使用jQuery的簡單示例：
<script>
window.jQuery || document.write('<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"><\/script>');
(function ready(){
if(window.jQuery) {
jQuery.noConflict();
var $ = jQuery;
$(document).ready(function() {
// Your plugin code
});
} else {
setTimeout(ready, 50);
}
})();
</script>
實現自動登錄第三方網站
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.