Jquery 简明教程

jQuery Tutorial

这个 jQuery 教程由经验丰富的 Web 前端程序员编写，他们在项目中广泛地使用 JavaScript 和 jQuery。撰写本教程旨在帮助 jQuery 初学者了解 jQuery 框架从基本到高级的知识。学习完本教程后，您将发现自己具有很高的 jQuery 框架专业知识，可以将自己的水平提升到下一个级别。

This jQuery Tutorial has been prepared by well experienced front end programmers who are using Javascript and jQuery extensively in their projects. This tutorial has been developed for the jQuery beginners to help them understand the basics to advanced of jQuery Framework. After completing this tutorial, you will find yourself at a great level of expertise in jQuery Framework, from where you can take yourself to the next levels.

What is jQuery?

jQuery 是一个重量轻的 JavaScript 库，它非常快速且简洁。这个库在 2006 年由 John Resig 编写，并且

jQuery is a lightweight Javascript library which is blazing fast and concise. This library was created by John Resig in 2006 and

jQuery 被设计用于简化 HTML DOM 树的遍历和操作、事件处理、CSS 动画和 Ajax。

jQuery has been designed to simplify HTML DOM tree traversal and manipulation, as well as event handling, CSS animation, and Ajax.

jQuery 可以用于通过 ID、类或属性在 HTML 文档中查找特定的 HTML 元素，然后我们可以使用 jQuery 来更改同一个元素的一个或多个属性，比如颜色、可见性等等。jQuery 还可以用于通过响应像鼠标单击这样的事件使网页具有交互性。

jQuery can be used to find a particular HTML element in the HTML document with a certain ID, class or attribute and later we can use jQuery to change one or more of attributes of the same element like color, visibility etc. jQuery can also be used to make a webpage interactive by responding to an event like a mouse click.

jQuery 在以下原则下开发：

jQuery has been developed with the following principles:

  1. Separation of JavaScript and HTML, which encourages developers to completely separate JavaScript code from HTML markup.

  2. Brevity and clarity promotes features like chainable functions and shorthand function names.

  3. Eliminates of cross-browser incompatibilities, so developers does not need to worry about browser compatibility while writing code using jQuery library.

  4. Extensibility, which means new events, elements, and methods can be easily added in jQuery library and then reused as a plugin.

jQuery Online Editor

我们提供了 jQuery Online Editor ，它可帮助您直接从浏览器 Edit 和 Execute 代码。尝试单击图标 来运行以下 jQuery 代码以打印常规的“Hello, World!”。

We have provided jQuery Online Editor which helps you to Edit and Execute the code directly from your browser. Try to click the icon to run the following jQuery code to print conventional "Hello, World!".

<html>
   <head>
      <title>The jQuery Example</title>
      <script src = "https://www.tutorialspoint.com/jquery/jquery-3.6.0.js">
      </script>

      <script type = "text/javascript">
         $(document).ready(function() {
            $("h1").html("Hello, World!");
         });
      </script>
   </head>

   <body>
      <h1>Hello</h1>
   </body>
</html>

Browser Support

截至 2022 年 4 月，jQuery 3.0 和更新版本支持 Firefox、Chrome、Safari 和 Edge 的“current-1 versions”，以及 Internet Explorer 9 及更新版本。在移动设备上，它支持 iOS 7 及更新版本，以及 Android 4.0 及更新版本。

As of April 2022, jQuery 3.0 and newer supports "current-1 versions" of Firefox, Chrome, Safari, and Edge as well as Internet Explorer 9 and newer versions. On mobile it supports iOS 7 and newer, and Android 4.0 and newer.

jQuery and Javascript Jobs

jQuery 和 JavaScript 需求量都很高，所有主要的 Web 应用程序都以这样或那样的方式使用 jQuery。我们在编写本教程之前探索了许多主要的求职网站，发现全球跨国公司都有大量空缺。

jQuery and Javascripts both are very high in demand and all major web applications are making use of jQuery in one or another way. We explored many major job websites before writing this tutorial and found that there are numerous openings across the world in multi national companies.

JavaScript 和 jQuery 开发人员的平均年薪约为 150,000 美元。但因地点而异。以下几家伟大的公司正在使用 Kotlin：

Average annual salary for a Javascript and jQuery developer is around $150,000. Though it can vary depending on the location. Following are the great companies who are using Kotlin:

  1. Google

  2. Amazon

  3. Netflix

  4. Zomato

  5. Uber

  6. Trello

  7. Coursera

  8. Basecamp

  9. Unacademy

  10. Byjus

  11. Many more…​

因此，您可能是任何这些大公司的下一个潜在员工。我们为 jQuery 开发了非常棒的学习材料，这将帮助您根据 jQuery 准备技术面试和认证考试。所以，使用我们简单有效的教程，随时随地在任何地方开始学习 jQuery，完全按照您的进度。

So, you could be the next potential employee for any of these major companies. We have develop a great learning material for jQuery which will help you to prepare for the technical interviews and certification exams based on jQuery. So, start learning jQuery using our simple and effective tutorial anywhere and anytime absolutely at your pace.

Before you Start

在继续学习本教程之前，您应该对 HTML、CSS、JavaScript、文档对象模型 (DOM) 和任何文本编辑器有基本的了解。由于我们将使用 jQuery 开发基于 Web 的应用程序，如果您了解 Internet 和基于 Web 的应用程序的工作原理，那就更好了。

Before proceeding with this tutorial, you should have a basic understanding of HTML, CSS, JavaScript, Document Object Model (DOM) and any text editor. As we are going to develop web based application using jQuery, it will be good if you have understanding on how internet and web based applications work.