导入 jQuery

使用 Script 标签导入 jQuery 使用 ES6 语法导入 jQuery 使用 Browserify/Webpack 导入 jQuery 使用 AMD（异步模块定义）导入 jQuery 有几种方法可以使用不同的

使用 Script 标签导入 jQuery

使用 ES6 语法导入 jQuery

使用 Browserify/Webpack 导入 jQuery

使用 AMD（异步模块定义）导入 jQuery

有几种方法可以使用不同的平台导入 jQuery。本教程演示了将 jQuery 导入环境的不同方法。

使用 Script 标签导入 jQuery

这是在 HTML script 标签中导入 jQuery 文件的最常用方法。我们可以提供源链接或下载文件并提供源中文件的路径。

参见示例：

使用链接：

使用下载的文件：

这两种方法在基本的 jQuery 导入中都很有用。

使用 ES6 语法导入 jQuery

Babel 是下一代 JavaScript 编译器。Babel 具有编译 JavaScript 代码的 ES6 和 ES2015 模块的功能。

此方法仅支持 Babel 等编译器；浏览器不支持 ES6/ES2015。请参阅下面的如何使用 ES6 语法导入 jQuery。

import {$, jQuery} from 'jquery';

// to use jQuery

window.$ = $;

window.jQuery = jQuery;

或者更简单的方法：

import jQuery from 'jquery';

window.$ = window.jQuery = jQuery;

这两种方法对于像 Babel 这样的编译器都很方便。

使用 Browserify/Webpack 导入 jQuery

Browserify 和 Webpack 可以通过多种方式使用。我们可以在 Browserify/Webpack 中将 jQuery 作为变量导入。

参见示例：

var $ = require('jquery');

有关更多信息，可以在下面查看官方文档。

Browserify

Webpack

使用 AMD（异步模块定义）导入 jQuery

异步模块定义 (AMD) 是为浏览器创建的模块格式。我们可以使用函数在 AMD 中导入 jQuery。

参见示例：

define(['jquery'], function($) {

// code here

});

有关 AMD 的更多信息，请参阅此处。

Enjoying our tutorials? Subscribe to DelftStack on YouTube to support us in creating more high-quality video guides. Subscribe