jquery slim что это | Все о Windows 10
На чтение 5 мин. Просмотров 40 Опубликовано
На CDNJS размещен пакет jquery.slim. Он имеет меньший размер. Каковы основные отличия от оригинала? Беглый взгляд на код не дал ответа, и на jquery.com я не нашел никаких ссылок о slim упаковке.
Итак, каковы различия между jquery.js и jquery.slim.js?
6 ответов
Глядя на код, я обнаружил следующие различия между jquery.js и jquery.slim.js:
В jquery.slim.js удалены следующие функции кода:
- jQuery.fn.extend
- jquery.fn.load
- jquery.each // Прикрепите набор функций для обработки общих событий AJAX
- jQuery.expr.filters.animated
- настройки ajax, такие как jQuery.ajaxSettings.xhr, jQuery.ajaxPrefilter, jQuery.ajaxSetup, jQuery.ajaxPrefilter, jQuery.ajaxTransport, jQuery.ajaxSetup
- XML-разбор, как jQuery.parseXML,
- анимационные эффекты, такие как jQuery.easing, jQuery.Animation, jQuery.speed
Наряду с обычной версией jQuery, которая включает в себя модули Ajax и эффектов, мы выпускаем «тонкую» версию, которая исключает эти модули. В общем, это исключает ajax, эффекты и устаревший код.
Размер файла (gzipped) примерно на 6 КБ меньше, 23,6 КБ против 30 КБ.
В настоящее время наиболее авторитетным ответом, по-видимому, является этот вопрос , в котором говорится, что «это пользовательская сборка jQuery, исключающая эффекты, ajax и устаревший код». Подробности будут объявлены в jQuery 3.0.
Я подозреваю, что обоснование исключения этих компонентов из библиотеки jQuery заключается в признании все более распространенного сценария использования jQuery в сочетании с другой средой JS, такой как Angular или React. В этих случаях использование jQuery в первую очередь предназначено для обхода и манипулирования DOM, поэтому исключение тех компонентов, которые либо устарели, либо предоставлены платформой, позволяет уменьшить размер файла примерно на 20%.
Стройное телосложение
Иногда вам не нужен ajax, или вы предпочитаете использовать одну из многих автономных библиотек, которые фокусируются на запросах ajax. И часто проще использовать комбинацию CSS и манипуляции с классами для всех ваших веб-анимаций. Наряду с обычной версией jQuery, которая включает в себя модули Ajax и Effects, мы выпустили «тонкую» версию, которая исключает эти модули. В общем, это исключает ajax, эффекты и устаревший код. В настоящее время размер jQuery очень редко влияет на производительность при загрузке, но тонкая сборка примерно на 6 тыс. Байт сжата по сравнению с обычной версией — 23,6 тыс. Против 30 тыс. Байт.
At CDNJS jquery.slim package is placed. It has a smaller size. What are the major differences from an original? A quick look at the code didn’t bring the answer, and at the jquery.com I’ve not found any reference about slim package.
So, what are the differences between jquery.js and jquery.slim.js ?
6 Answers 6
Looking at the code I found the following differences between jquery.js and jquery.slim.js:
In the jquery.slim.js, the following features are removed:
- jQuery.fn.extend
- jquery.fn.load
- jquery.each // Attach a bunch of functions for handling common AJAX events
- jQuery.expr.filters.animated
- ajax settings like jQuery.ajaxSettings.xhr, jQuery.ajaxPrefilter, jQuery.ajaxSetup, jQuery.ajaxPrefilter, jQuery.ajaxTransport, jQuery.ajaxSetup
- xml parsing like jQuery.parseXML,
- animation effects like jQuery.easing, jQuery.Animation, jQuery.speed
Along with the regular version of jQuery that includes the ajax and effects modules, we’re releasing a “slim” version that excludes these modules. All in all, it excludes ajax, effects, and currently deprecated code.
The file size (gzipped) is about 6k smaller, 23.6k vs 30k.
At this time, the most authoritative answer appears to be in this issue, which states «it is a custom build of jQuery that excludes effects, ajax, and deprecated code.» Details will be announced with jQuery 3.0.
I suspect that the rationale for excluding these components of the jQuery library is in recognition of the increasingly common scenario of jQuery being used in conjunction with another JS framework like Angular or React. In these cases, the usage of jQuery is primarily for DOM traversal and manipulation, so leaving out those components that are either obsolete or are provided by the framework gains about a 20% reduction in file size.
Sometimes you don’t need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for all your web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we’ve released a “slim” version that excludes these modules. All in all, it excludes ajax, effects, and currently deprecated code. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version – 23.6k vs 30k.
I could see $.ajax is removed from jQuery slim 3.2.1
Below is the comment from the slim version with the features removed
Собственно не понятно, что происходит: window.jQuery || document.write(‘
Как это работает? и зачем?
- Вопрос задан более года назад
- 415 просмотров
Это fallback на случай, если из CDN jquery не загрузится.
javascript — В чем разница между jquery min js и slim js
Версия Slim легче, чем версия min. Я пробовал оба, но не нашел никакой разницы. Это такие же?
1
Ariful Islam 19 Ноя 2020 в 04:32
2 ответа
Лучший ответ
jQuery slim, в отличие от полной библиотеки jQuery:
исключает модули ajax и эффектов
Это существует как в минифицированной, так и в неминифицированной форме:
https://code.jquery.com/jquery-3.5.1.slim.min.js
https://code.jquery.com/jquery-3.5.1.slim.js
JQuery в целом может обслуживаться как минифицированным, так и не минифицированным. Он также может использоваться как тонкая версия или как полная версия.
Минификация — это процесс, с помощью которого символы в скрипте сжимаются , сохраняя при этом функциональность. Например, var c.
Таким образом, тонкая сборка и минифицированная сборка — это не одно и то же, хотя у них схожие цели — уменьшить количество кода, который необходимо отправить по сети.
Если вам не нужны модули jQuery ajax и эффекты, используйте для производства тонкую, миниатюрную версию. Если вам нужны модули ajax или эффектов, не используйте тонкую версию; используйте уменьшенную полную версию для производства. Для разработки используйте унифицированную версию, чтобы ошибки внутри jQuery были понятны.
1
CertainPerformance 19 Ноя 2020 в 01:35
Тонкая сборка, исключающая модули ajax и эффектов, небольшие различия между min и slim.min:
Jquery.slim.min.js (сжатая / производственная сборка)
Jquery.slim.js (несжатая / разработка)
0
Wasif Hasan 19 Ноя 2020 в 01:35
Использование интерфейса командной строки LibMan с ASP.NET Core
- Чтение занимает 6 мин
В этой статье
Автор: Скотт Адди (Scott Addie)By Scott Addie
Интерфейс командной строки LibMan (LibMan CLI) — это кроссплатформенная программа, которая поддерживается везде, где поддерживается .NET Core.The LibMan CLI is a cross-platform tool that’s supported everywhere .NET Core is supported.
Предварительные требованияPrerequisites
УстановкаInstallation
Чтобы установить LibMan CLI, выполните следующую команду:To install the LibMan CLI:
dotnet tool install -g Microsoft.Web.LibraryManager.Cli
Глобальное средство .NET Core устанавливается из пакета NuGet Microsoft.Web.LibraryManager.Cli.A .NET Core Global Tool is installed from the Microsoft.Web.LibraryManager.Cli NuGet package.
Чтобы установить LibMan CLI из определенного источника пакета NuGet, выполните следующую команду:To install the LibMan CLI from a specific NuGet package source:
dotnet tool install -g Microsoft.Web.LibraryManager.Cli --version 1.0.94-g606058a278 --add-source C:\Temp\
В предыдущем примере глобальное средство .NET Core устанавливается из файла C:\Temp\Microsoft.Web.LibraryManager.Cli.1.0.94-g606058a278.nupkg на локальном компьютере Windows.In the preceding example, a .NET Core Global Tool is installed from the local Windows machine’s
ИспользованиеUsage
После успешной установки CLI можно использовать следующую команду:After successful installation of the CLI, the following command can be used:
libman
Чтобы узнать установленную версию CLI, выполните следующую команду:To view the installed CLI version:
libman --version
Чтобы просмотреть доступные команды CLI, выполните следующую команду:To view the available CLI commands:
libman --help
Приведенная выше команда выводит результат наподобие следующего:The preceding command displays output similar to the following:
1.0.163+g45474d37ed
Usage: libman [options] [command]
Options:
--help|-h Show help information
--version Show version information
Commands:
cache List or clean libman cache contents
clean Deletes all library files defined in libman.json from the project
init Create a new libman.json
install Add a library definition to the libman.json file, and download the
library to the specified location
restore Downloads all files from provider and saves them to specified
destination
uninstall Deletes all files for the specified library from their specified
destination, then removes the specified library definition from
libman.json
update Updates the specified library
Use "libman [command] --help" for more information about a command.
Доступные команды CLI описываются в следующих разделах.The following sections outline the available CLI commands.
Инициализация LibMan в проектеInitialize LibMan in the project
Команда libman init создает файл libman.json, если он еще не существует.The libman init command creates a libman.json file if one doesn’t exist. Файл создается с содержимым шаблона по умолчанию.The file is created with the default item template content.
Краткий обзорSynopsis
libman init [-d|--default-destination] [-p|--default-provider] [--verbosity]
libman init [-h|--help]
ПараметрыOptions
Для команды libman init доступны следующие параметры:The following options are available for the libman init command:
-d|--default-destination <PATH>Путь относительно текущей папки.A path relative to the current folder. Файлы библиотеки устанавливаются в этом расположении, если в файле libman.json свойство
destinationдля библиотеки не задано.Library files are installed in this location if nodestinationproperty is defined for a library in libman.json. Значение<PATH>записывается в свойствоdefaultDestinationв файле libman.json.The<PATH>value is written to thedefaultDestinationproperty of libman.json.-p|--default-provider <PROVIDER>Поставщик, который будет использоваться, если поставщик для данной библиотеки не указан.The provider to use if no provider is defined for a given library. Значение
<PROVIDER>записывается в свойствоdefaultProviderв файле libman.json.The<PROVIDER>value is written to thedefaultProviderproperty of libman.json. Замените<PROVIDER>одним из следующих значений:Replace<PROVIDER>with one of the following values:cdnjsfilesystemjsdelivrunpkg
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Чтобы создать файл libman.json в проекте ASP.NET Core, выполните указанные ниже действия.To create a libman.json file in an ASP.NET Core project:
Перейдите в корневой каталог проекта.Navigate to the project root.
Выполните следующую команду:Run the following command:
libman initВведите имя поставщика по умолчанию или нажмите клавишу
Enter, чтобы использовать поставщик CDNJS по умолчанию.Type the name of the default provider, or pressEnterto use the default CDNJS provider. Допустимы следующие значения:Valid values include:cdnjsfilesystemjsdelivrunpkg
В корневой каталог проекта добавляется файл libman.json со следующим содержимым:A libman.json file is added to the project root with the following content:
{
"version": "1.0",
"defaultProvider": "cdnjs",
"libraries": []
}
Добавление файлов библиотекиAdd library files
Команда libman install скачивает и устанавливает файлы библиотеки в проект.The libman install command downloads and installs library files into the project. Если файл libman.json еще не существует, он создается.A libman.json file is added if one doesn’t exist. В файле libman.json сохраняются данные конфигурации для файлов библиотеки.The libman.json file is modified to store configuration details for the library files.
Краткий обзорSynopsis
libman install <LIBRARY> [-d|--destination] [--files] [-p|--provider] [--verbosity]
libman install [-h|--help]
АргументыArguments
LIBRARY
Имя устанавливаемой библиотеки.The name of the library to install. В имени может использоваться нотация номера версии (например, @1.2.0).This name may include version number notation (for example, @1.2.0).
ПараметрыOptions
Для команды libman install доступны следующие параметры:The following options are available for the libman install command:
-d|--destination <PATH>Расположение для установки библиотеки.The location to install the library. Если не указано, используется расположение по умолчанию.If not specified, the default location is used. Если в файле libman.json свойство
defaultDestinationне указано, этот параметр является обязательным.If nodefaultDestinationproperty is specified in libman.json, this option is required.--files <FILE>Укажите имя файла, который необходимо установить из библиотеки.Specify the name of the file to install from the library. Если не указано, устанавливаются все файлы из библиотеки.If not specified, all files from the library are installed. Для каждого устанавливаемого файла необходимо задать один параметр
--files.Provide one--filesoption per file to be installed. Также поддерживаются относительные пути.Relative paths are supported too. Например,--files dist/browser/signalr.js.For example:--files dist/browser/signalr.js.-p|--provider <PROVIDER>Имя поставщика, используемого для получения библиотеки.The name of the provider to use for the library acquisition. Замените
<PROVIDER>одним из следующих значений:Replace<PROVIDER>with one of the following values:cdnjsfilesystemjsdelivrunpkg
Если значение не указано, используется свойство
defaultProviderиз файла libman.json.If not specified, thedefaultProviderproperty in libman.json is used. Если в файле libman.json свойствоdefaultProviderне указано, этот параметр является обязательным.If nodefaultProviderproperty is specified in libman.json, this option is required.
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Рассмотрим следующий файл libman.json:Consider the following libman.json file:
{
"version": "1.0",
"defaultProvider": "cdnjs",
"libraries": []
}
Чтобы установить файл jquery.min.js jQuery версии 3.2.1 в папку wwwroot/scripts/jquery с использованием поставщика CDNJS, выполните следующую команду:To install the jQuery version 3.2.1 jquery.min.js file to the wwwroot/scripts/jquery folder using the CDNJS provider:
libman install [email protected] --provider cdnjs --destination wwwroot/scripts/jquery --files jquery.min.js
Содержимое файла libman.json выглядит примерно так:The libman.json file resembles the following:
{
"version": "1.0",
"defaultProvider": "cdnjs",
"libraries": [
{
"library": "[email protected]",
"destination": "wwwroot/scripts/jquery",
"files": [
"jquery.min.js"
]
}
]
}
Чтобы установить файлы calendar.js и calendar.css из папки C:\temp\contosoCalendar\ с использованием поставщика файловой системы, выполните следующую команду:To install the calendar.js and calendar.css files from C:\temp\contosoCalendar\ using the file system provider:
libman install C:\temp\contosoCalendar\ --provider filesystem --files calendar.js --files calendar.css
Приведенный ниже запрос появляется по двум причинам:The following prompt appears for two reasons:
- В файле libman.json нет свойства
defaultDestination.The libman.json file doesn’t contain adefaultDestinationproperty. - Команда
libman installне содержит параметра-d|--destination.Thelibman installcommand doesn’t contain the-d|--destinationoption.
После принятия назначения по умолчанию содержимое файла libman.json будет выглядеть примерно так:After accepting the default destination, the libman.json file resembles the following:
{
"version": "1.0",
"defaultProvider": "cdnjs",
"libraries": [
{
"library": "[email protected]",
"destination": "wwwroot/scripts/jquery",
"files": [
"jquery.min.js"
]
},
{
"library": "C:\\temp\\contosoCalendar\\",
"provider": "filesystem",
"destination": "wwwroot/lib/contosoCalendar",
"files": [
"calendar.js",
"calendar.css"
]
}
]
}
Восстановление файлов библиотекRestore library files
Команда libman restore устанавливает файлы библиотеки, определенные в файле libman.json.The libman restore command installs library files defined in libman.json. Действуют следующие правила.The following rules apply:
- Если файла libman.json нет в корневом каталоге проекта, возвращается ошибка.If no libman.json file exists in the project root, an error is returned.
- Если для библиотеки указан поставщик, свойство
defaultProviderв файле libman.json игнорируется.If a library specifies a provider, thedefaultProviderproperty in libman.json is ignored. - Если для библиотеки указано назначение, свойство
defaultDestinationв файле libman.json игнорируется.If a library specifies a destination, thedefaultDestinationproperty in libman.json is ignored.
Краткий обзорSynopsis
libman restore [--verbosity]
libman restore [-h|--help]
ПараметрыOptions
Для команды libman restore доступны следующие параметры:The following options are available for the libman restore command:
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Чтобы восстановить файлы библиотеки, определенные в файле libman.json, выполните следующую команду:To restore the library files defined in libman.json:
libman restore
Удаление файлов библиотекDelete library files
Команда libman clean удаляет файлы библиотек, восстановленные ранее с помощью LibMan.The libman clean command deletes library files previously restored via LibMan. Папки, которые становятся пустыми после выполнения этой операции, удаляются.Folders that become empty after this operation are deleted. Конфигурации, связанные с файлами библиотек, в свойстве libraries файла libman.json не удаляются.The library files’ associated configurations in the libraries property of libman.json aren’t removed.
Краткий обзорSynopsis
libman clean [--verbosity]
libman clean [-h|--help]
ПараметрыOptions
Для команды libman clean доступны следующие параметры:The following options are available for the libman clean command:
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Чтобы удалить файлы библиотек, установленные с помощью LibMan, выполните следующую команду:To delete library files installed via LibMan:
libman clean
Удаление файлов библиотекUninstall library files
Команда libman uninstall делает следующее:The libman uninstall command:
- удаляет все файлы, связанные с указанной библиотекой, из назначения в файле libman.json;Deletes all files associated with the specified library from the destination in libman.json.
- удаляет связанную конфигурацию библиотеки из файла libman.json.Removes the associated library configuration from libman.json.
В следующих случаях возникает ошибка:An error occurs when:
- файла libman.json нет в корневом каталоге проекта;No libman.json file exists in the project root.
- указанная библиотека не существует.The specified library doesn’t exist.
Если установлено несколько библиотек с одним и тем же именем, вам будет предложено выбрать одну из них.If more than one library with the same name is installed, you’re prompted to choose one.
Краткий обзорSynopsis
libman uninstall <LIBRARY> [--verbosity]
libman uninstall [-h|--help]
АргументыArguments
LIBRARY
Имя удаляемой библиотеки.The name of the library to uninstall. В имени может использоваться нотация номера версии (например, @1.2.0).This name may include version number notation (for example, @1.2.0).
ПараметрыOptions
Для команды libman uninstall доступны следующие параметры:The following options are available for the libman uninstall command:
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Рассмотрим следующий файл libman.json:Consider the following libman.json file:
{
"version": "1.0",
"defaultProvider": "cdnjs",
"libraries": [
{
"library": "[email protected]",
"files": [
"jquery.min.js",
"jquery.js",
"jquery.min.map"
],
"destination": "wwwroot/lib/jquery/"
},
{
"provider": "unpkg",
"library": "[email protected]",
"destination": "wwwroot/lib/bootstrap/"
},
{
"provider": "filesystem",
"library": "C:\\temp\\lodash\\",
"files": [
"lodash.js",
"lodash.min.js"
],
"destination": "wwwroot/lib/lodash/"
}
]
}
Для удаления jQuery можно выполнить любую из следующих команд:To uninstall jQuery, either of the following commands succeed:
libman uninstall jquerylibman uninstall [email protected]Чтобы удалить файлы Lodash, установленные с помощью поставщика
filesystem, выполните следующую команду:To uninstall the Lodash files installed via thefilesystemprovider:libman uninstall C:\temp\lodash\
Обновление версии библиотекиUpdate library version
Команда libman update обновляет библиотеку, установленную с помощью LibMan, до указанной версии.The libman update command updates a library installed via LibMan to the specified version.
В следующих случаях возникает ошибка:An error occurs when:
- файла libman.json нет в корневом каталоге проекта;No libman.json file exists in the project root.
- указанная библиотека не существует.The specified library doesn’t exist.
Если установлено несколько библиотек с одним и тем же именем, вам будет предложено выбрать одну из них.If more than one library with the same name is installed, you’re prompted to choose one.
Краткий обзорSynopsis
libman update <LIBRARY> [-pre] [--to] [--verbosity]
libman update [-h|--help]
АргументыArguments
LIBRARY
Имя обновляемой библиотеки.The name of the library to update.
ПараметрыOptions
Для команды libman update доступны следующие параметры:The following options are available for the libman update command:
-preПолучение последней предварительной версии библиотеки.Obtain the latest prerelease version of the library.
--to <VERSION>Получение определенной версии библиотеки.Obtain a specific version of the library.
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Чтобы обновить jQuery до последней версии, выполните следующую команду:To update jQuery to the latest version:
libman update jqueryЧтобы обновить jQuery до версии 3.3.1, выполните следующую команду:To update jQuery to version 3.3.1:
libman update jquery --to 3.3.1Чтобы обновить jQuery до последней предварительной версии, выполните следующую команду:To update jQuery to the latest prerelease version:
libman update jquery -pre
Управление кэшем библиотекManage library cache
Команда libman cache управляет кэшем библиотек LibMan.The libman cache command manages the LibMan library cache. Поставщик filesystem не использует кэш библиотек.The filesystem provider doesn’t use the library cache.
Краткий обзорSynopsis
libman cache clean [<PROVIDER>] [--verbosity]
libman cache list [--files] [--libraries] [--verbosity]
libman cache [-h|--help]
АргументыArguments
PROVIDER
Используется только с командой clean.Only used with the clean command. Указывает кэш поставщика, который нужно очистить.Specifies the provider cache to clean. Допустимы следующие значения:Valid values include:
cdnjsfilesystemjsdelivrunpkg
ПараметрыOptions
Для команды libman cache доступны следующие параметры:The following options are available for the libman cache command:
-h|--helpОтображение справочных сведений.Show help information.
--verbosity <LEVEL>Задание уровня детализации результатов.Set the verbosity of the output. Замените
<LEVEL>одним из следующих значений:Replace<LEVEL>with one of the following values:
ПримерыExamples
Чтобы просмотреть имена кэшируемых библиотек для каждого поставщика, выполните одну из следующих команд:To view the names of cached libraries per provider, use one of the following commands:
libman cache listlibman cache list --librariesВыходные данные должны выглядеть примерно так:Output similar to the following is displayed:
Cache contents: --------------- unpkg: knockout react vue cdnjs: font-awesome jquery knockout lodash.js reactЧтобы просмотреть имена кэшируемых файлов библиотек для каждого поставщика, выполните следующую команду:To view the names of cached library files per provider:
libman cache list --filesВыходные данные должны выглядеть примерно так:Output similar to the following is displayed:
Cache contents: --------------- unpkg: knockout: <list omitted for brevity> react: <list omitted for brevity> vue: <list omitted for brevity> cdnjs: font-awesome metadata.json jquery metadata.json 3.2.1\core.js 3.2.1\jquery.js 3.2.1\jquery.min.js 3.2.1\jquery.min.map 3.2.1\jquery.slim.js 3.2.1\jquery.slim.min.js 3.2.1\jquery.slim.min.map 3.3.1\core.js 3.3.1\jquery.js 3.3.1\jquery.min.js 3.3.1\jquery.min.map 3.3.1\jquery.slim.js 3.3.1\jquery.slim.min.js 3.3.1\jquery.slim.min.map knockout metadata.json 3.4.2\knockout-debug.js 3.4.2\knockout-min.js lodash.js metadata.json 4.17.10\lodash.js 4.17.10\lodash.min.js react metadata.jsonОбратите внимание, что в представленных выше выходных данных показано, что для поставщика CDNJS кэшируются версии jQuery 3.2.1 и 3.3.1.Notice the preceding output shows that jQuery versions 3.2.1 and 3.3.1 are cached under the CDNJS provider.
Чтобы очистить кэш библиотек для поставщика CDNJS, выполните следующую команду:To empty the library cache for the CDNJS provider:
libman cache clean cdnjsПосле очистки кэша поставщика CDNJS команда
libman cache listвыводит следующее:After emptying the CDNJS provider cache, thelibman cache listcommand displays the following:Cache contents: --------------- unpkg: knockout react vue cdnjs: (empty)Чтобы очистить кэш для всех поддерживаемых поставщиков, выполните следующую команду:To empty the cache for all supported providers:
libman cache cleanПосле очистки кэша всех поставщиков команда
libman cache listвыводит следующее:After emptying all provider caches, thelibman cache listcommand displays the following:Cache contents: --------------- unpkg: (empty) cdnjs: (empty)
Дополнительные ресурсыAdditional resources
Микрофреймворк Slim PHP
Практически любой веб-разработчик, даже начинающий, скорее всего, слышал или знаком с понятием фреймворк. Напомню, что фреймворк – это набор библиотек (функций и методов), или если сказать несколько иначе это каркас, будущего приложения, то есть веб-проекта, сайта или скрипта. При этом, фреймворк предлагает определенные методы, которые избавляют программиста от стандартной рутинной работы, к примеру создание точки входа на сайт, создание ЧПУ, организация работы с базой данных и т.д. Таким образом, фреймворк позволяет создавать приложения быстрее, эффективнее и безопаснее. И, как правило, все фреймворки обладают огромнейшим функционалом и возможностями. Но очень часто при разработке небольших проектов, весь функционал фреймворка попросту не нужен, вполне достаточно только неких базовых возможностей. В этом случае на помощь приходят микрофреймворки.
Микрофреймворк – это тот же каркас будущего веб-приложения, но значительно упрощенный. То есть простой и быстрый в работе. Который, состоит только из определенного программного ядра будущего сайта, скрипта или веб-проекта. Главная задача микрофреймворков – это простое расширяемое ядро. В них нет абстрактного уровня базы данных, нет валидации форм или всего того, что уже реализовано в различных сторонних библиотеках, к которым можно обращаться. Микрофреймворк всегда можно расширить самостоятельно и добавить необходимую функциональность. При этом, так как микрофреймворк предлагает только базовый функционал – он очень прост в работе и изучении.
Поэтому в данном курсе мы с Вами научимся работать с одним из наиболее популярных микрофреймвоков – Slim. Курс будет разбит на два раздела. Первый – это теоретический, в котором, мы изучим основы работы с данным фреймворком, познакомимся с маршрутизаторами и узнаем, как формировать страницы и отображать данные на экране. Второй – это практический раздел, в котором мы создадим несложную систему управления контентом, используя инструменты данного фреймворка, и соответственно закрепим полученные знания.
Все уроки курса:
Количество уроков: 18
Продолжительность курса: 13:21:48
Автор: Виктор Гавриленко
Меня зовут Виктор Гавриленко. Еще учась в институте, начал увлекаться компьютерными технологиями и программированием, на протяжении многих лет усиленно занимаюсь разработкой интернет сайтов и веб-программированием.
Описание курса: В данном курсе мы с Вами научимся работать с одним из наиболее популярных микрофреймвоков – Slim. Курс будет разбит на два раздела. Первый – это теоретический, в котором мы изучим основы работы с данным фреймворком, познакомимся с маршрутизаторами и узнаем, как формировать страницы и отображать данные на экране. Второй – это практический раздел, в котором мы создадим несложную систему управления контентом, используя инструменты данного фреймворка, и соответственно закрепим полученные знания
Категории премиум
8.8. Работа с javascript/jQuery в Drupal 8. Что такое behaviors?
Для начала давайте вернемся к тому как подключать кастомные javascript файлы к нашей теме. В файле .libraries.yml нужно подключить js:
global-styling:version: 1.x
css:
theme:
css/style.css: {}
css/print.css: { media: print }
js:
js/custom.js: {}
dependencies:
— core/jquery
— core/jquery.once
Важно соблюдать отступы, чтобы он был в два пробела. Итак, мы подключили файл js/custom.js. Но этого не достаточно чтобы у нас работал jQuery. Дело в том что ядро друпала не требует jQuery и jQuery не подключается. Его нужно подключать отдельно:
dependencies:
— core/jquery
Также мы будем использовать jQuery.once(), это отдельный плагин для jQuery, для того чтобы навешивать события и методы на селектор только однажды.
dependencies:
— core/jquery
— core/jquery.once
Дело в том, что мы будем писать код javascript, который будет вызывать друпалом несколько раз по разным событиям. Поэтому нам будет нужен этот метод .once().
Теперь давайте добавим немного кода в файл custom.js:
(function ($) {
Drupal.behaviors.myModuleBehavior = {
attach: function (context, settings) {
$(context).find(‘.click-me’).once(‘myCustomBehavior’).click(function () {
alert(‘Hello, World!’);
});
}
};
})(jQuery);
Давайте разберем по порядку, что это все значит.
(function ($) {
})(jQuery);
Мы оборачиваем код jQuery в такую конструкцию, потому что jQuery в друпале запускается в режиме .noConflict(). Это нужно для того чтобы использовать знак доллара $, и это не конфликтовало с другими javascript фреймворками Prototype, MooTools. Вряд ли вам придется встретиться с этими фреймворками, jQuery плотно занял лидирующие позиции. Но в эту конструкцию вам придется оборачивать весь jQuery-код.
(function ($) {
Drupal.behaviors.myModuleBehavior = {
attach: function (context, settings) {
}
};
})(jQuery);
Вот мы и подошли к behavior’ам. Если вы пишите jQuery код в друпале, вам нужно его во-первых обернуть в function($), а во-вторых в behavior. Имя behavior’а должно быть уникальным, у нас в примере myModuleBehavior, но вам нужно для каждого behavior писать свое имя:
(function ($) {
Drupal.behaviors.myModuleBehavior = {
attach: function (context, settings) {
}
};
Drupal.behaviors.productPageBehavior = {
attach: function (context, settings) {
}
};
})(jQuery);
Используйте camelCase для наименования behavior’ов. Behavior вызывается при загрузке страницы, на каждый AJAX-запрос. Таким образом, когда на сайт подгружается новый контент и встраивается в структуру существующего сайта, то вызывается код из behavior, каждый раз. Это значительно отличается от конструкции:
$(document).ready(function () {
// Do some fancy stuff.
// Не используйте такой код в Drupal 8 (да и в Drupal 7 тоже).
});
которая вызывается только один раз при загрузке странице.
Если вы начали использовать behavior’ы и заметили, что у вас происходят странные события с сайтом, например через jQuery блок добавляется несколько раз:
(function ($) {
Drupal.behaviors.myModuleBehavior = {
attach: function (context, settings) {
// Behavior вызывается несколько раз на странице, не забывайте использовать функцию .once().
$(‘.inner’).append(‘<p>Test</p>’);
}
};
})(jQuery);
При каждом ajax-запросе у вас будет добавлять еще один параграф Test. Поэтому нужно добавить функцию .once():
(function ($) {
Drupal.behaviors.myModuleBehavior = {
attach: function (context, settings) {
// Behavior вызывается несколько раз на странице, не забывайте использовать функцию .once().
$(‘.inner’).once(‘add-paragraph’).append(‘<p>Test</p>’);
}
};
})(jQuery);
Еще одна фича behavior это переменная context. Каждый раз когда на сайт добавляется новый контент при загрузке страницы или через ajax, то весь новый контент находится в переменной context. Таким образом нам не нужно проходить все DOM дерево, после каждого ajax запроса, чтобы навесить событие на селектор. Достаточно пройтись только по context’у:
(function ($) {
Drupal.behaviors.myModuleBehavior = {
attach: function (context, settings) {
// Behavior вызывается несколько раз на странице, не забывайте использовать функцию .once().
$(context).find(‘.inner’).once(‘add-paragraph’).append(‘<p>Test</p>’);
}
};
})(jQuery);
Теперь добавление параграфа написано в правильном друпал стиле. Конечно, вы можете использовать старую запись с document.ready(), но тогда это будет работать только один раз и медленнее чем через behavior’ы.
Если у вас возникнут вопросы по jQuery/javascript или предложения по дополнительным темам пишите в комментариях.
Краткое введение в Bootstrap
Bootstrap — свободный набор инструментов для создания сайтов и веб-приложений. Включает в себя HTML- и CSS-шаблоны оформления для типографики, веб-форм, кнопок, меток, блоков навигации и прочих компонентов веб-интерфейса, включая JavaScript-расширения.
Цель этого руководства — показать, как настроить систему для правильного использования JS- и CSS-компонентов Bootstrap.
Прим. перев. В статье не рассматривается целесообразность использования или не использования данного фреймворка. Как и любое другое решение, Bootstrap обладает своими преимуществами и недостатками.
Официальный сайт предлагает несколько способов подключения фреймворка к своему проекту:
- Скачать скомпилированные файлы JS и CSS. Скачав файлы на локальную машину, вы можете выбрать, какую версию включить в свой проект — минифицированную или стандартную. Этот вариант подходит при работе со своим проектом локально и не требует от проекта доступа в Интернет.
- Скачать исходники файлов. Этот вариант подойдёт, если вы знакомы с работой менеджеров задач и сборщиками (Gulp, Grunt, webpack) и уже создали собственную конфигурацию. В таком случае вы вряд ли захотите копировать исходники Bootstrap в свой проект.
- Включить в проект файлы через CDN. Похоже на первый вариант, но не придётся скачивать никаких файлов. Это самый быстрый способ использовать Bootstrap в своей разработке, но требует постоянного доступа к Интернету.
- Подключить через npm. Вероятно, самый оптимальный вариант, особенно, если вы собираетесь создать полноценное приложение, а не просто опытный образец.
- Варианты с использованием RubyGems, Composer и NuGet.
Стоит отметить, что Bootstrap предоставляет три готовых к использованию файла и может быть использован для:
- Создания прототипов или приложений.
- Реализации Reset (альтернативы Normalize.css).
- Вёрстки с помощью Grid.
При этом для использования двух последних опций нет необходимости включать в проект весь фреймворк целиком. Для этого есть отдельные файлы.
Практика
Предполагается, что вы знакомы с Sass и каким-либо сборщиком. Кроме того, вам потребуется npm.
Смотрите также: Развёрнутое руководство по Sass/SCSS
Сначала нужно добавить в проект необходимые зависимости:
npm init -y && npm i bootstrap jquery-slim popper.jsТиповая структура проекта выглядит так:
. ├── src │ ├── scripts │ │ ├── app │ │ │ └── .gitkeep │ │ ├── vendor │ │ │ ├── bootstrap.js │ │ │ └── jquery.js │ │ ├── app.js │ │ └── vendor.js │ ├── styles │ │ ├── app │ │ │ ├── _base.scss │ │ │ └── _variables.scss │ │ ├── vendor │ │ │ └── bootstrap │ │ │ ├── _core.scss │ │ │ ├── _main.scss │ │ │ └── _variables.scss │ │ ├── app.scss │ │ └── vendor.scss │ └── index.html ├── package.json └── webpack.config.js
Стоит пояснить, какие преимущества предоставляет такая структура. Сначала рассмотрим папку styles, а затем перейдём к scripts.
Styles
Эта папка содержит две вложенные директории app и vendor, а также два файла с теми же именами.
- Папка
appбудет содержать все компоненты вашего приложения, переменные, настраиваемые стили и так далее. - Папка
vendorиспользуется для зависимостей. В данном случае это только Bootstrap, расположенный в соответствующей директории. Для каждой зависимости выделяется отдельная вложенная папка.
Необходимо подключить Bootstrap и код нашего приложения в файле app.scss. Это делается следующим образом:
@import 'vendor/bootstrap/core';
@import 'app/variables';
@import 'app/base';Теперь обратите внимание на папку styles/app. Там всего два файла:
- В файле
_baseописываются стили. Может расширяться с помощьюNormalize.css. - В
_variablesразмещаются переменные приложения.
В vendor.scss импортируются зависимости. Сейчас единственная наша зависимость — Bootstrap, поэтому этот файл содержит только одну строку.
@import 'vendor/bootstrap/main';Рассмотрим файлы в папке styles/vendor/bootstrap.
- В
_coreимпортируются наши переменные и три основных файла Bootstrap, без которых фреймворк не сможет работать:
@import 'variables';
@import '~bootstrap/scss/functions';
@import '~bootstrap/scss/variables';
@import '~bootstrap/scss/mixins'; _mainимпортирует файл_core.scssвашего проекта в самом верху, а также все необходимые файлы Bootstrap SASS из папкиnode_modules:
@import 'core';
@import '~bootstrap/scss/root';
@import '~bootstrap/scss/reboot';
@import '~bootstrap/scss/type';
@import '~bootstrap/scss/images';
@import '~bootstrap/scss/code';
@import '~bootstrap/scss/grid';
@import '~bootstrap/scss/tables';
@import '~bootstrap/scss/forms';
@import '~bootstrap/scss/buttons';
@import '~bootstrap/scss/transitions';
@import '~bootstrap/scss/dropdown';
@import '~bootstrap/scss/button-group';
@import '~bootstrap/scss/input-group';
@import '~bootstrap/scss/custom-forms';
@import '~bootstrap/scss/nav';
@import '~bootstrap/scss/navbar';
@import '~bootstrap/scss/card';
@import '~bootstrap/scss/breadcrumb';
@import '~bootstrap/scss/pagination';
@import '~bootstrap/scss/badge';
@import '~bootstrap/scss/jumbotron';
@import '~bootstrap/scss/alert';
@import '~bootstrap/scss/progress';
@import '~bootstrap/scss/media';
@import '~bootstrap/scss/list-group';
@import '~bootstrap/scss/close';
@import '~bootstrap/scss/modal';
@import '~bootstrap/scss/tooltip';
@import '~bootstrap/scss/popover';
@import '~bootstrap/scss/carousel';
@import '~bootstrap/scss/utilities';
@import '~bootstrap/scss/print';
В Webpack (автор использует этот сборщик) знак тильды (~) указывает, что файлы нужно искать в папке node_modules. Если вы используете, например, Grunt, то нужно установить grunt-sass-tilde-importer. Если какие-то из представленных компонентов не использованы в проекте, ни в коем случае не надо удалять сами файлы, нужно лишь закомментировать их импорт.
_variablesизначально пуст. В нём переопределяют переменные Bootstrap под конкретный проект.
В каждой переменной Bootstrap установлен флаг !default. Таким образом, если проект содержит заранее определённые переменные, то они будут использованы вместо дефолтных.
Scripts
Чтобы сделать скрипты модульными, нужно включить в проект только необходимые компоненты. Однако в Bootstrap это не такая простая задача. Подробно этот процесс описан в документации к фреймворку.
Начать следует с файла scripts/vendor.js, который просто импортирует файлы из папки vendor:
import './vendor/jquery'
import './vendor/bootstrap' Смотрите также: Как отказаться от jQuery в современном фронтенде
Необходимо инициализировать jQuery в объекте window, в противном случае Bootstrap не сможет скомпилироваться. Кроме того, это всё равно придётся сделать, если вы планируете использовать jQuery в приложении. Импорт jQuery в файле scripts/vendor/jquery.js:
import jQuery from 'jquery'
window.$ = window.jQuery = jQueryКак и в файле vendor, придётся импортировать каждый модуль отдельно. Вы также можете закомментировать неиспользуемые компоненты, чтобы исключить их из проекта. Содержимое файла scripts/vendor/jquery.js:
// Core
import Util from 'bootstrap/js/src/util'
// Components
import Alert from 'bootstrap/js/src/alert'
import Button from 'bootstrap/js/src/button'
import Carousel from 'bootstrap/js/src/carousel'
import Collapse from 'bootstrap/js/src/collapse'
import Dropdown from 'bootstrap/js/src/dropdown'
import Modal from 'bootstrap/js/src/modal'
import Popover from 'bootstrap/js/src/popover'
import Scrollspy from 'bootstrap/js/src/scrollspy'
import Tab from 'bootstrap/js/src/tab'
import Tooltip from 'bootstrap/js/src/tooltip' Следует отметить, что модуль Util используется везде, кроме компонентов Button и Popover.
Таким образом, скомпилировав Bootstrap в отдельный файл, можно применять функции и переменные ядра фреймворка в любом месте в проекте. Кроме того, благодаря реализации модульного принципа, ненужные компоненты легко отключить.
Примеры использования
SCSS
Миксины Bootstrap можно использовать в приложении глобально:
//styles/app/_base.scss
:root {
font-size: 14px;
@include media-breakpoint-up('md.) {
font-size: 16px;
}
}Можно использовать дефолтные значения переменных и переопределять их:
// styles/app/_variables.scss
$font-family: 'Roboto Condensed', $font-family-sans-serif;
// styles/app/_base.scss
body {
font-family: $font-family;
} JavaScript
Можно создавать экземпляры любых компонентов Bootstrap в файле scripts/app.js:
$(function () {
$('#dummy-modal').modal('show')
}) Чтобы лучше разобраться, вы можете изучить полностью настроенный и функционирующий проект Webpack v4 Configuration, в котором реализована описанная логика. Это хороший пример того, как можно настроить Bootstrap под себя.
Также рекомендуем обратить внимание на видеокурс «Bootstrap для начинающих».
Перевод статьи Bootstrap Framework — Best Practices
⚙PLAYSTATION 4 SLIM — ДОСУГ ЦИФРОВОЙ
Сентябрь также принес с новостями в играх, если мы видели несколько месяцев назад, когда Xbox пытался заново изобрести свою концепцию консоли с Xbox One S, PlayStation не хотела быть меньше и также делает ставку на Рождество. Сектор видеоигр находится на подъеме, и компании хотят воспользоваться этой возможностью, чтобы соблазнить публику.
Хотя в телефонии обычно существуют дифференцированные полосы, к которым пользователи стремятся по-разному, в видео консолях это еще более заметно. Игроки обычно являются последователями консольного бренда, которые стремятся следовать с этого момента и редко переключаются на соревнование.
Поклонники PlayStation ожидали новостей в формате PS4 и вот они. Слухи о том, что ждет будущего PS4 Neo, компания решает обновить свой корпус, сделав его тоньше и эффективнее . Я бы дополнил серию более мощной и толстой Pro-версией. Slim кажется преемником обычной тонкой модели приставок PS.
Игроки уже с нетерпением ждут возможности разместить свой новый PS4 Slim, который теперь будет куда проще, но
Что еще возвращает?
дизайн
Дизайн PS4 Slim — это то, что привлекает наибольшее внимание с первого взгляда и, следовательно, его имя. Его шасси по-прежнему выполнено из тех же пластиковых материалов с той же отделкой, но с уменьшенной толщиной в пределах 265 × 39 × 288 мм, его вес составляет около 2, 1 кг по сравнению с предыдущими 2, 8 кг. Размер уменьшается на 30% и на 16% легче, что позволяет легко размещать его где угодно и не беспокоиться о весе.
Дизайн сверху меняется, чтобы быть полностью отполированным с логотипом PlayStation в середине. Мы видим гораздо более закругленные края в отличие от углов, отмеченных в оригинальной модели.
Детали кажутся практически такими же, как и в предыдущей модели. В нижней части мы обнаруживаем новизну с деталями дизайна, заключающиеся в том, что различные характерные символы (треугольник, круг, квадратная рамка) вокруг символа PlayStation напечатаны на нижней опоре.
В передней части кнопки питания и извлечения меняются местами, и мы больше не находим ее справа в центральной передней части, а слева направо в выделении, которое имеет более традиционный характер. Прекратите быть настолько тонко тактильным и станьте более практичным с ясными эмблемами показа. Правда в том, что теперь при большем перемещении мешает, так как до минимального контакта кнопки были активированы. Это также означает отсутствие функционального индикатора, который предупреждал о состоянии консоли.
В конце мы видим различные порты, Ethernet, USB и сетевой вход в дополнение к разделу для извлечения жесткого диска.
Элемент управления DualShock 4 практически не изменяется, хотя мы находим небольшие различия, такие как цвет клавиш со стрелками, но вес, размер и функции практически одинаковы. Новинкой стало то, что, подключив пульт дистанционного управления к консоли с помощью кабеля, вы можете выбрать, как это сделать — через Bluetooth или USB. Кроме того, он также имеет новую световую панель на сенсорной панели, которая показывает состояние. Он обещает быть более эргономичным и адаптируемым к руке.
Еще одной новинкой являются услуги, которые включают или будут включать, например, опыт работы с очками VR, что будет доступно в ближайшие недели.
производительность
Производительность этой новой PS4 Slim улучшена благодаря специальному процессору с 8-ядерным чипом AMD Jaguar x86-64 . Он имеет память 8 ГБ GDDR5 для анимации самых мощных игр. Визуальная анимация взята из руки графического движка TFLOPS AMD 1, 84 на базе Radeon. Он совместим с HDR, так что у вас будет больше опыта в ваших любимых играх, как и в последнем обновлении прошивки из предыдущего. По производительности следует отметить, что он такой же, как и в традиционной PS4.
Несмотря на включение формата HDR, правда заключается в том, что в этом варианте контента недостаточно для игр, таких как Amazon или Netflix, которые, как поставщики, признают, что им нечего предложить в этом формате, а только то, что совместно использует 4K с HDR. На данный момент это вариант, который можно эксплуатировать мало.
Одна из вещей, которые обещают с этим новым PS4 Slim, — это большая эффективность и меньший нагрев в сочетании с шумоподавлением, что весьма заметно в предыдущей модели.
хранение
Как и в традиционной модели, мы находим две доступные версии, которые будут влиять на окончательную цену: 500 ГБ или 1 ТБ. Помните, что он поставляется с возможностью замены жесткого диска.
связь
В связи мы находим эти характеристики.
- 2 высокоскоростных порта USB ( USB 3.1 Gen1 )
- 1 порт AUX
- 1 порт Ethernet (10BASE-T, 100BASE-TX, 1000BASE-T)
- Wi-Fi IEEE 802.11 a / b / g / n / ac
- Bluetooth® 4.0 (улучшение по сравнению с предыдущим поколением 2.1)
- Выход HDMI совместим с выходом HDR
цена
Цена нового PS4 Slim составляет 299 евро и уже продается в отличие от Pro, который выйдет в ноябре и будет стоить на 100 евро дороже. Когда оставшийся запас будет закончен, этот Slim станет основной моделью PS4.
заключение
Новый PS4 slim отличается странным отличием от традиционного PS4: он на 30% компактнее и на 16% легче, поэтому его удобнее брать с собой в путешествие или куда-либо размещать. Дизайн заново изобретен с более округлыми концами и более функциональными кнопками, такими как передние кнопки.
Внутри он обещает меньше шума и большую эффективность, хотя ядро в основном то же самое. С совместимой системой HDR обещаны большие впечатления, но правда в том, что адаптированный к ней контент весьма скуден и вряд ли может быть использован в качестве преимущества, так как нет названий, которые поставляются с этой опцией, а поставщики включают материалы только с HDR и 4K.
Добрые намерения с моделью Slim, которую компания уже принимала в других случаях и которая стоит в цене. Мы советуем вам купить его, если у вас нет PS4, или если вам необходимо пространство, и вам нужна меньшая консоль.
В остальном вопросы о вкусах и деталях дизайна. Еще предстоит увидеть модель, которая делает большой скачок в качестве графики, да, рынок также должен адаптироваться к новым требованиям к контенту, иначе любой прогресс в консолях будет сорван.
Часто задаваемые вопросы о jQuery
Часто задаваемые вопросы о веб-технологиях, связанных с jQuery и jQuery.
Что такое jQuery?
jQuery — это библиотека JavaScript (НЕ РАМКА), созданная для более быстрого, простого и кроссбраузерного веб-дизайна.
jQuery — это элегантная, многофункциональная библиотека JavaScript, которая упрощает веб-анимацию, манипуляции с DOM, обработку событий и т. Д.
Что такое последняя версия jQuery?
Последняя версия jQuery — jQuery 3.4.1.
Кто использует jQuery?
Исследование показывает, что jQuery используется 74,1% всех веб-сайтов (июль 2019 г.).
JQuery мертв / устарел?
Я думаю, что jQuery никогда не умрет, пока существует DOM.
В связи с рождением и развитием различных фреймворков JavaScript (React, Angular, Vue) в последние годы jQuery стал менее популярным, чем в предыдущие годы.
Наша статистика показывает, что загрузка плагинов jQuery в последние годы была стабильной без значительного снижения (1 августа 2019 г.).
Куда поставить библиотеку jQuery и скрипт jQuery?
Я настоятельно рекомендую вам поместить библиотеку jQuery и скрипт jQuery в конец документа (но перед закрывающим тегом тела) для повышения производительности страницы.
Если вы используете плагин jQuery, не забудьте поместить плагин jQuery после jQuery и вызвать функцию в готовом документе.
Какую версию jQuery мне использовать?
Ваши клиенты все еще используют устаревшие браузеры (Internet Explorer 7/8/9)?
- Да -> jQuer 1.х
- Нет -> jQuery 3.x, 4.x
Используете ли вы в своем проекте анимацию и технологию AJAX?
- Да -> Обычная версия
- Нет -> Тонкая сборка
Что такое jQuery Slim Build?
Тонкая сборка jQuery представлена в финальном выпуске jQuery 3.0, который создан для уменьшения размера jQuery и повышения скорости загрузки страницы.
Slim build примерно на 6кбайт в сжатом виде меньше, чем обычная версия — 23.6к против 30к. Он исключает ajax, эффекты и устаревший код.
Как использовать плагины jQuery в WordPress?
БиблиотекаjQuery теперь по умолчанию интегрирована в ядро Wordpress.
Чтобы использовать плагин jQuery в своем плагине WordPress, просто загрузите скрипт и загрузите его в WordPress, а затем вызовите плагин в режиме совместимости с , чтобы избежать конфликтов (замените $ на jQuery) .
// обычный
$ (селектор) .plugin ({
// параметры, обратные вызовы и т. д.
})
// Режим совместимости
jQuery (селектор).плагин ({
// параметры, обратные вызовы и т. д.
})
Учитывает ли регистр в селекторах jQuery?
Да. JavaScript — это язык с учетом регистра.
Можно ли использовать jQuery с Javascript?
Конечно. Сам jQuery — это библиотека JavaScript. Он отлично работает с любым проектом JavaScript.
Можно ли использовать jQuery с React / Angular / Vue?
Да, но не рекомендуется.
Подготовка HTML для jQuery
В этой статье предполагается, что вы имеете базовое представление о HTML и CSS.Если HTML или CSS для вас новичок, мы рекомендуем вам изучить основы HTML и CSS, прежде чем пытаться использовать jQuery. См. Руководства по HTML от w3schools или их руководства по CSS, чтобы получить полезные советы по началу изучения HTML или CSS.
jQuery — это библиотека Javascript, которая упрощает использование Javascript. Это похоже на сокращенную форму Javascript. Вместо написания Javascript вы можете использовать короткое действие jQuery.
Подготовка HTML для jQuery
jQuery был создан специально для выбора элементов HTML и применения к ним действий.Эти действия могут быть любыми: от скрытия элементов до вызова действия при щелчке по элементу.
Чтобы сообщить HTML-документу, что вы используете jQuery, вам необходимо вызвать библиотеку jQuery. Вы можете сделать это двумя разными способами.
Ссылка на эту библиотеку должна быть , а затем для любого кода jQuery.
Добавить библиотеку jQuery CDN
Это более простой вариант. Все, что вам нужно сделать, это указать вашему HTML-документу, чтобы он извлекал библиотеку из ссылки на CDN библиотеки jQuery.
Существует много разных версий и CDN. Вы можете перейти на jQuery CDN — Последние стабильные версии, чтобы увидеть jQuery CDN. Для реализации просто найдите версию, которую вы хотите использовать, и выберите наиболее желаемый вариант: несжатая, уменьшенная, уменьшенная или уменьшенная. Это даст вам ссылку, которую вам нужно добавить в свой HTML-документ, чтобы вызвать библиотеку jQuery.
Вы также можете посетить статью Другие CDN для jQuery CDN от Google, Microsoft и т. Д. Они также дадут вам ссылку, которую вы можете использовать.
Добавьте выбранную ссылку прямо перед закрывающим элементом