Home  >  Article  >  Web Front-end  >  How to import local jquery

How to import local jquery

PHPz
PHPzOriginal
2023-04-17 10:29:312882browse

In front-end development, jQuery is widely used as a powerful JavaScript library. And if we want to import jQuery locally, the common methods are as follows:

1. Introduction through CDN

The most common way to import jQuery is through CDN (content distribution network) . jQuery's official promotion states that they provide CDN services on multiple platforms such as Google, Microsoft, CDNJS, jsDelivr, etc. We can directly copy the corresponding link and introduce it in the head tag of the HTML file, for example:

<!-- jquery cdn  -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

2. Download and localize

If you are unable to connect to the Internet during use, you can download jQuery from the official website and store it locally, such as storing it in the folder where the project is located (such as a js file folder) and then import it, for example:

<!--   引入本地的jquery文件 -->
<script src="./js/jquery.min.js"></script>

Although this method sometimes increases the loading time of the web page, it also facilitates offline work and facilitates project code management.

3. Install using NPM

When we use packaging tools such as Webpack to develop projects, we usually use NPM for installation. At this point, we can install jQuery through the following command:

npm install jquery --save

After the installation is complete, we can use the import statement in the JavaScript file to introduce it, for example:

import $ from 'jquery';

It should be noted that in After using NPM to install jQuery, we need to configure the corresponding build tools (such as Webpack) in the project to handle jQuery packaging and output issues.

The above are several common methods of importing local jQuery. When using it, we can choose the method that suits us best according to the actual situation.

The above is the detailed content of How to import local jquery. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn