Помимо предотвращения конфликтов версий и разрыва страницы содержимого, я делаю несколько других вещей в своем шаблоне пользовательского скрипта по умолчанию, который включает jQuery.
Приведенный ниже шаблон направлен на достижение следующих целей в интересах того, чтобы быть универсальным шаблоном для включения jQuery в новые сценарии независимо от текущего или будущего статуса страницы содержимого в отношении собственного включения или отсутствия jQuery любой версии.
- избегайте изолированной программной среды безопасности с помощью @grant none
- в целом не обращайте внимания на то, где скрипт вставляется/когда он выполняется
- включить конкретную версию jQuery для нашего UserScript
- Сохраните ссылки $ и jQuery на странице содержимого, какими бы они ни были, jQuery или нет.
- Разрешить нашему скрипту использовать псевдоним $ для своей версии jQuery.
Использование @grant none здесь является ключевым
//@grant none
@grant none работает для 99% моих скриптов. Это позволяет легко получить доступ к переменным, функциям и объектам страницы содержимого, поддерживая глобальную область действия для UserScript (это) и предоставляя неквалифицированный доступ к глобальной области действия (окну) страницы содержимого путем поиска переменных, идентификаторов функций в обеих областях в этом , порядок окон. Таким образом, если вы избегаете дублирования идентификаторов, существующих на странице содержимого, вы можете получить доступ к переменным, функциям и возвращаемым значениям страницы содержимого без уточнения ("это" или "окно"). И вы можете сделать это из любого места в вашем скрипте.
Это подчеркивает оригинальную проблему ОП. Удобство, которое обеспечивает @grant none, также является причиной того, что директива @require перезаписывает ссылки $ и jQuery окна при его загрузке. Библиотека jQuery уже давно включает функцию noConflict() для решения только этой проблемы.
Мы можем сразу же внести некоторые быстрые улучшения в ответ выше, чтобы повысить нашу безопасность/совместимость/повторное использование.
window.jQ = $.noConflict(true);
- Этот вызов не указывает явно $ на область
- И это не будет работать особенно хорошо, если страница контента также включает какую-то другую библиотеку с псевдонимом $. Особенно, если страница содержимого уже вызвала jQuery noConflict до того, как мы сюда доберемся. Это ненужная кроличья нора, в которую можно попасть.
- Этот код несколько тревожно помещает ссылку на нашу библиотеку в область действия окна, где она вполне может быть позже каким-то образом изменена страницей содержимого. Как правило, показывать что-либо в области действия окна по очевидным причинам — плохая практика.
Этот код вместо
this.$ = window.jQuery.noConflict(true);
- Сохраняет нашу библиотеку в нашей области, где она принадлежит
- дает нам псевдоним $ в нашей области видимости для дальнейшего использования в нашем скрипте
- восстанавливает псевдонимы окна $ и jQuery до тех, которые были, когда наш jQuery загружался, независимо от того, были ли они на самом деле jQuery или нет
- дает нам лучший шанс использовать объект jQuery, загруженный сценарием, для вызова noConflict
Этот последний пункт, вероятно, является излишним, но почему бы не быть явным и не использовать идентификатор jQuery для вызова noConflict. Хотя на данный момент это была бы наша вина, если бы $ не был jQuery, когда этот вызов запускается (@require для другой библиотеки, которая использует $, используя ее самостоятельно перед запуском этого кода и т. д.), это бесплатное предотвращение последующей отладки.
Хотя мы могли бы быть довольны этим, мы также можем пойти немного дальше, чтобы обеспечить совместимость на самом широком спектре страниц и на самых разнообразных изменениях страниц контента.
(function ($, undefined) {
$(function () {
//Your code here;
});
})(window.jQuery.noConflict(true));
Хотя это еще не гарантируется, этот шаблон дает вашему функциональному коду наилучшие шансы на выполнение в самых разнообразных возможностях жизненного цикла страницы, сохраняя псевдоним $ из глобальной области видимости и используя событие jQuery DOM Ready для обеспечения завершения страницы. Кроме того, это также обеспечивает согласованное неопределенное значение для вашего кода.
// ==UserScript==
// @name jQuery safe inclusion template
// @description include jQuery and make sure window.$ is the content page's jQuery version, and this.$ is our jQuery version.
// @version 0.0.1
// @author Sonic Beard
// @match http://*.site.com/*
// @require http://cdn.jsdelivr.net/jquery/2.1.3/jquery.min.js
// @grant none
// ==/UserScript==
(function ($, undefined) {
$(function () {
//Your code here;
});
})(window.jQuery.noConflict(true));
31.03.2015
