jquery教程_jQuery教程

jquery教程

I have written a lot of jQuery tutorial articles. This is an index post for all the jQuery tutorials posted here, you should go through these to learn jQuery.

我写了很多jQuery教程文章。 这是此处发布的所有jQuery教程的索引发布，您应该阅读这些内容以学习jQuery。

jQuery教程 (jQuery Tutorial)

1. What is jQuery?
   什么是jQuery？

2. A quick roundup on jQuery and it’s features.

   jQuery及其功能的快速汇总。

3. jQuery Hello World
   jQuery Hello世界

4. Learn how to download jQuery JS file and use it in HTML pages. jQuery hello world program with complete explanation of jQuery functions.

   了解如何下载jQuery JS文件并在HTML页面中使用它。 jQuery hello world程序，带有jQuery函数的完整说明。

5. jQuery document ready
   jQuery文档准备就绪

6. Learn about $(document).ready() jQuery function and it’s advantage.

   了解$(document).ready() jQuery函数及其优势。

7. jQuery addClass
   jQuery addClass

8. jQuery addClass method example to add one or more specified classes to the matched DOM elements.

   jQuery addClass方法示例，可将一个或多个指定的类添加到匹配的DOM元素中。
9. jQuery fadeIn, fadeOut, fadeTo
   jQuery fadeIn，fadeOut，fadeTo

10. jQuery fadeOut, fadeIn and fadeTo functions can be used for transparency effect in HTML.

    jQuery fadeOut，fadeIn和fadeTo函数可用于HTML中的透明效果。

11. jQuery add
    jQuery添加

12. jQuery add method can be used to add elements, selectors or html to the matched elements.

    jQuery add方法可用于将元素，选择器或html添加到匹配的元素。

13. jQuery after
    jQuery之后

14. jQuery after method can be used to add HTML content, DOM element, or jQuery object to insert after each element in the set of matched elements.

    jQuery after方法可用于添加HTML内容，DOM元素或jQuery对象，以在匹配的元素集中的每个元素之后插入。

15. jQuery selector by class
    jQuery选择器按类

16. jQuery selector by class name allows you to find a specific HTML element with the value of its class attribute.

    jQuery选择器按类名允许您使用其class属性的值来查找特定HTML元素。

17. jQuery selector by id
    jQuery选择器ID

18. jQuery selector by ID allows you to find a specific HTML element with the value of its attribute id.

    jQuery ID选择器允许您使用其属性ID的值查找特定HTML元素。

19. jQuery selector by name
    jQuery选择器的名称

20. jQuery selector by name or Element selector allows you to find all HTML elements with the given tag name.

    jQuery选择器的名称或元素选择器允许您查找具有给定标签名称的所有HTML元素。

21. jQuery selector
    jQuery选择器

22. jQuery selector is the most significant element in the jQuery library. Learn about jQuery selector syntax and it’s usage.

    jQuery选择器是jQuery库中最重要的元素。 了解有关jQuery选择器语法及其用法的信息。

23. jQuery animate
    jQuery动画

24. jQuery animate() method is used to perform a custom animation of a set of CSS properties. This method allows you to create custom animation only on numeric properties.

    jQuery animate（）方法用于执行一组CSS属性的自定义动画。 此方法允许您仅在数字属性上创建自定义动画。

25. jQuery noConflict
    jQuery noConflict

26. jQuery noConflict() method releases the control of the $ variable. You might have seen many JavaScript libraries which uses $ variable. In jQuery $ is used as an alias for jQuery. If you want to use the $ variable of other libraries, jQuery have to release the control over the $ variable by calling this method.

    jQuery noConflict（）方法释放$变量的控件。 您可能已经看到许多使用$变量JavaScript库。 在jQuery中，$用作jQuery的别名。 如果要使用其他库的$变量，则jQuery必须通过调用此方法来释放对$变量的控制。

27. jQuery clearQueue
    jQuery clearQueue

28. jQuery clearQueue() removes all the functions waiting to execute or the queued functions of the selected element.

    jQuery clearQueue（）删除所有等待执行的函数或所选元素的排队函数。

29. jQuery delay
    jQuery延迟

30. jQuery delay() method is used to delay the execution of items in the queue. This method sets a timer to delay the execution.

    jQuery delay（）方法用于延迟队列中项目的执行。 此方法设置计时器以延迟执行。

31. jQuery attribute manipulation
    jQuery属性操纵

32. The most basic components we can manipulate using jQuery is through the attributes and properties of the HTML DOM elements. Learn about jQuery get attribute, set attribute, remove attribute with examples.

    我们可以使用jQuery操纵的最基本的组件是通过HTML DOM元素的属性和属性。 通过示例了解jQuery get属性，set属性，remove属性。

33. jQuery hide, show, toggle
    jQuery隐藏，显示，切换

34. we can use these jQuery methods to hide an HTML element, show any hidden HTML element and toggle it from hidden/shown.
    These methods are used a lot in real web pages, where you get to see the data on click of a button. On click again, the data is again hidden.

    我们可以使用这些jQuery方法来隐藏HTML元素，显示任何隐藏HTML元素并从“隐藏/显示”中切换它。
    这些方法在实际的网页中经常使用，您只需单击一下按钮即可查看数据。 再次单击，数据再次被隐藏。

35. jQuery dequeue
    jQuery出队

36. jQuery deQueue() method removes the next function waiting to execute in the queue of the selected elements.

    jQuery deQueue（）方法删除在所选元素的队列中等待执行的下一个函数。

37. jQuery slide up, down, toggle
    jQuery上下滑动

38. jQuery provides three useful sliding effect methods – slideUp, slideDown and slideToggle. We can use these methods to show and hide an HTML DOM element with sliding effect.

    jQuery提供了三种有用的滑动效果方法-slideUp，slideDown和slideToggle。 我们可以使用这些方法来显示和隐藏具有滑动效果HTML DOM元素。

39. jQuery UI Tabs
    jQuery UI选项卡

40. jQuery UI tabs allow us to create tabs in view pages. These tabs can be horizontal as well as vertical too. It’s a very common feature and you will find it in a lot of login and registration pages.

    jQuery UI选项卡允许我们在视图页面中创建选项卡。 这些选项卡可以是水平的也可以是垂直的。 这是非常常见的功能，您可以在许多登录和注册页面中找到它。

41. HTML5 progress bar with jQuery animation
    带有jQuery动画HTML5进度栏

42. HTML5 progress tag is used to create progress bar in view pages. You can use jQuery animation to spice up the progress bar.

    HTML5 progress标签用于在视图页面中创建进度栏。 您可以使用jQuery动画为进度条增添趣味。

43. jQuery event methods
    jQuery事件方法

44. jQuery event method registers an event handler when the user interacts with the web pages. We can make any manipulations on the selected element after registering the event handler. This makes the web page more dynamic.

    当用户与网页交互时，jQuery事件方法将注册事件处理程序。 注册事件处理程序后，我们可以对所选元素进行任何操作。 这使网页更加动态。

45. jQuery click
    jQuery单击

46. jQuery click() method fires on clicking an HTML element. This method will attach an event handler to the click event.

    jQuery click（）方法在单击HTML元素时触发。 此方法会将事件处理程序附加到click事件。

47. jQuery double click
    jQuery双击

48. jQuery dblclick() method fires when an HTML element is double clicked. This method will attach an event handler to the double click event. We can do desired manipulations on the selected HTML element using this event handler.

    双击HTML元素时，将触发jQuery dblclick（）方法。 此方法会将事件处理程序附加到双击事件。 我们可以使用此事件处理程序对选定HTML元素进行所需的操作。

49. jQuery mouse events
    jQuery鼠标事件

50. jQuery mouse over, mouse up, down, move, leave examples.

    jQuery的鼠标悬停，鼠标上移，下移，移动，留下示例。

51. jQuery hover
    jQuery悬停

52. jQuery hover() method fires when the mouse pointer enters and leaves the selected HTML element. This method will attach two event handlers to execute when the mouse enters and leaves the element. The hover() method attaches handlers for mouse enter and mouse leave events.

    当鼠标指针进入并离开选定HTML元素时，jQuery hover（）方法将触发。 当鼠标进入和离开元素时，此方法将附加两个事件处理程序以执行。 hover（）方法为鼠标进入和鼠标离开事件附加处理程序。

53. jQuery keyup
    jQuery键盘

54. jQuery keyup method triggers when you release the pressed key. You can attach functions to execute when this event occurs.

    当您释放按下的键时，jQuery keyup方法将触发。 您可以附加函数以在发生此事件时执行。

55. jQuery keydown
    jQuery按键

56. jQuery keydown method triggers when you first press a key on the keyboard and hold it. You can attach functions to execute when this event occurs.

    首次按下键盘上的某个键并按住时，jQuery keydown方法将触发。 您可以附加函数以在发生此事件时执行。

57. jQuery keypress
    jQuery按键

58. jQuery keypress method triggers with key press event of the javascript. Since this event varies across browsers, this is not covered in any official specification. This event triggers only for the focused element. This can vary across different browsers.

    jQuery keypress方法使用javascript的按键事件触发。 由于此事件在不同的浏览器中会有所不同，因此任何正式规范均未涵盖。 此事件仅针对焦点元素触发。 跨不同的浏览器可能会有所不同。

59. jQuery resize
    jQuery调整大小

60. jQuery resize() method triggers when the browser window is resized. This method attaches a handler, which executes when the resize event is fired.

    调整浏览器窗口大小时，jQuery resize（）方法触发。 此方法附加一个处理程序，该处理程序在触发resize事件时执行。
61. jQuery scroll
    jQuery滚动

62. jQuery scroll() method triggers when the element is scrolled. This method attaches a handler, which executes when the scroll event is fired. A scroll event fires for all elements which are scrollable and it also fires for window objects.

    jQuery scroll（）方法在元素滚动时触发。 此方法附加一个处理程序，该处理程序在滚动事件触发时执行。 对于所有可滚动的元素，将触发滚动事件；对于窗口对象，也将触发滚动事件。

63. jQuery select
    jQuery选择

64. jQuery select() method triggers when a text in the text field or text area is selected.

    当在文本字段或文本区域中选择文本时，jQuery select（）方法触发。

65. jQuery submit
    jQuery提交

66. jQuery submit() function triggers when a user tries to submit a form.

    当用户尝试提交表单时，jQuery Submit（）函数将触发。

67. jQuery parent children
    jQuery父级子级

68. jQuery provides a lot of tree traversal functions that we can use to get the parent, child, siblings, previous and next elements.

    jQuery提供了许多树遍历功能，我们可以使用它们来获取父级，子级，同级，上一个和下一个元素。

69. jQuery first last
    jQuery第一个倒数第二个

70. jQuery first() method is used to get the first element from the selected HTML elements. jQuery last() method is used to get the last element from the selected HTML elements.

    jQuery first（）方法用于从选定HTML元素中获取第一个元素。 jQuery last（）方法用于从选定HTML元素中获取最后一个元素。

71. jQuery next() prev()
    jQuery next（）上一页（）

72. jQuery API provides two traversing methods next() and prev() that returns the immediately following and preceding sibling element of the selected HTML element.

    jQuery API提供了两个遍历方法next（）和prev（），它们返回所选HTML元素的紧随其后的同级元素。

73. jQuery siblings()
    jQuery兄弟姐妹（）

74. jQuery siblings() method is used to get all the siblings of the selected HTML element. Unlike jQuery next() and prev() methods, this method traverses both forward and backwards along the siblings of the selected element.

    jQuery siblings（）方法用于获取所选HTML元素的所有同级对象。 与jQuery next（）和prev（）方法不同，此方法沿选定元素的同级对象向前和向后遍历。

75. jQuery closest()
    jQuery最接近的（）

76. jQuery closest() method returns the first matched ancestor element of the selected HTML element. The method accepts a mandatory parameter, which filters out the traversal.

    jQuery最接近的（）方法返回所选HTML元素的第一个匹配的祖先元素。 该方法接受一个强制性参数，该参数会过滤掉遍历。

77. jQuery eq()
    jQuery eq（）

78. jQuery eq() method is used to get an element with a specific index of the selected HTML element. You can give either positive or negative integer value as index.

    jQuery eq（）方法用于获取具有选定HTML元素的特定索引的元素。 您可以指定正整数或负整数作为索引。

79. jQuery find()
    jQuery find（）

80. jQuery find() method returns all the descendant elements like child, grandchild and so on. This method is used if you want to search all the elements deeper in the DOM tree. This method traverses downwards and finds all its descendants of the selected element.

    jQuery find（）方法返回所有后代元素，例如child，孙子等等。 如果要搜索DOM树中更深的所有元素，则使用此方法。 此方法向下遍历并找到所选元素的所有后代。

81. jQuery each()
    jQuery each（）

82. jQuery each() method let us iterate over the DOM elements of the jQuery object and executes a function for each matched element.

    jQuery each（）方法使我们可以迭代jQuery对象的DOM元素，并为每个匹配的元素执行一个函数。

83. jQuery is()
    jQuery is（）

84. We use jQuery is() to check the selected element with another element, selector or any jQuery object. This method traverses along the DOM elements to find a match, which satisfies the passed parameter. It will return true if there is a match otherwise returns false.

    我们使用jQuery is（）与另一个元素，选择器或任何jQuery对象一起检查选定的元素。 此方法遍历DOM元素以找到匹配项，该匹配项满足传递的参数。 如果存在匹配项，它将返回true，否则返回false。

85. jQuery has(),
    not(), filter()
    jQuery has（），
    not（），filter（）

86. jQuery API provides traversing methods to filter out the matched elements. Some of these methods are discussed in this post – jQuery has(), not() and filter().

    jQuery API提供了遍历方法来过滤出匹配的元素。 本文中将讨论其中一些方法-jQuery has（），not（）和filter（）。

87. jQuery slice
    jQuery切片

88. jQuery slice() method reduces the matched set of elements to a subset specified by a range of indices. This method accepts two integer values, start index and end index. This method will return the elements between the start and end index.

    jQuery slice（）方法将匹配的元素集减少为由一系列索引指定的子集。 此方法接受两个整数值，开始索引和结束索引。 此方法将返回开始索引和结束索引之间的元素。

89. jQuery end()
    jQuery end（）

90. jQuery end() method ends the most recent filtering operation in the current chain, and return the matched set of elements to its previous state.This method does not take any arguments.

    jQuery end（）方法结束当前链中最新的过滤操作，并将匹配的元素集返回到其先前状态。此方法不带任何参数。

    jQuery UI教程 (jQuery UI Tutorial)

91. jQueryUI Datepicker
    jQueryUI日期选择器

92. The jQueryUI Datepicker plugin allow us to select a date from a popup or an in-line calendar. This plugin provide several options to customize the date format, localize calendar, restrict date range, and select a date range and many more.

    jQueryUI Datepicker插件允许我们从弹出窗口或嵌入式日历中选择日期。 该插件提供了多个选项来自定义日期格式，本地化日历，限制日期范围以及选择日期范围等等。

93. jQueryUI accordion
    jQueryUI手风琴

94. jQueryUI accordion plugin is used to display vertically stacked list of contents such as tabs or thumbnails that can be expanded to reveal the contents associate with it and you can also collapse the revealed contents.

    jQueryUI手风琴插件用于显示垂直堆叠的内容列表，例如选项卡或缩略图，可以扩展显示与之相关的内容，也可以折叠显示的内容。

95. jQueryUI Autocomplete
    jQueryUI自动完成

96. jQueryUI autocomplete plugin enables the users to easily search and filter items from an already populated list of items as they type on any input fields.

    jQueryUI自动完成插件使用户能够在任何输入字段上键入内容时轻松地从已填充的项目列表中搜索和过滤项目。

97. jQueryUI progress bar
    jQueryUI进度栏

98. jQuery UI provides progress bar plugin to indicate the percentage of completeness for a process. We can classify progressbar into two types – determinate and indeterminate.

    jQuery UI提供进度条插件来指示流程的完整性百分比。 我们可以将进度条分为两种类型-确定的和不确定的。

99. jQueryUI dialog
    jQueryUI对话框

100. The jQueryUI Dialog plugin is used for displaying information, which contains a dialog title and a content area. We can move, resize or close the dialog window.

     jQueryUI对话框插件用于显示信息，其中包含对话框标题和内容区域。 我们可以移动，调整大小或关闭对话框窗口。

101. jQueryUI tooltip
     jQueryUI工具提示

102. jQueryUI tooltip plugin is used to replace the native tooltips. We can customize the tooltip with different options, methods and events to improve the user experience.

     jQueryUI工具提示插件用于替换本机工具提示。 我们可以使用不同的选项，方法和事件来自定义工具提示，以改善用户体验。

103. jQueryUI Menu
     jQueryUI菜单

104. jQueryUI provides menu() method to create themeable menu with keyboard and mouse interaction. We can create menu from any valid markup and the most commonly used element is the unordered list.

     jQueryUI提供menu（）方法来创建具有键盘和鼠标交互作用的主题菜单。 我们可以从任何有效的标记中创建菜单，最常用的元素是无序列表。

105. jQuery Popup Overlay
     jQuery Popup叠加层

106. jQuery Popup Overlay plugin is used for responsive and accessible modal windows and tooltips.

     jQuery Popup Overlay插件用于响应式和可访问的模态窗口和工具提示。

107. jQueryUI Button,
     Buttonset
     jQueryUI按钮，
     按钮组

108. jQuery UI provides two widgets called Button and Buttonset Widget for creating themeable buttons. We can use these widgets to enhance the look and feel of standard form elements like buttons, inputs, anchors etc. These widgets use the jQuery UI CSS framework to enhance its look and feel.

     jQuery UI提供了两个名为Button和Buttonset Widget的小部件，用于创建主题化按钮。 我们可以使用这些小部件来增强标准表单元素（如按钮，输入，锚点等）的外观。这些小部件使用jQuery UI CSS框架来增强其外观。

109. How to develop a jQuery Plugin?
     如何开发一个jQuery插件？

110. Plugin is a piece of code that adds some kind of functionality to our applications. Plugins can be very helpful if you want to encapsulate a piece of behaviour that you may want to use in different parts of your applications. This jQuery tutorial outline the process of creating a jQuery plugin.

     插件是一段代码，为我们的应用程序添加了某种功能。 如果您想封装一些您可能希望在应用程序的不同部分中使用的行为，则插件可能会非常有用。 本jQuery教程概述了创建jQuery插件的过程。

111. jQuery scroll to top
     jQuery滚动到顶部

112. In this jQuery tutorial, you will learn how to create scroll to top button in jQuery.

     在此jQuery教程中，您将学习如何在jQuery中创建滚动到顶部按钮。

113. jQuery AJAX Java Web Application
     jQuery AJAX Java Web应用程序

114. This jQuery tutorial shows how to integrate jQuery and Ajax with java web application.

     该jQuery教程展示了如何将jQuery和Ajax与Java Web应用程序集成。

115. CSS3 Image Gallery with Thumbnail view
     具有缩略图视图CSS3图像库

116. Learn how to create image gallery with thumbnail view using CSS3 and jQuery.

     了解如何使用CSS3和jQuery创建具有缩略图视图的图像库。

117. jQuery Image Slider
     jQuery图像滑块

118. You will learn how to create jQuery image slider in a web page without using any framework.

     您将学习如何在不使用任何框架的情况下在网页中创建jQuery图像滑块。

119. jQuery image slider with thumbnail
     带有缩略图的jQuery图像滑块

120. This jQuery tutorial explains how to create jQuery thumbnail image slider.

     本jQuery教程介绍了如何创建jQuery缩略图滑块。

121. jQuery Content Slider with Pagination
     带分页的jQuery Content Slider

122. This jQuery tutorial explains how to create content slider with pagination using CSS and jQuery.

     该jQuery教程介绍了如何使用CSS和jQuery通过分页创建内容滑块。

123. jQuery Image Slider Plugins
     jQuery图像滑块插件

124. A curated list of jQuery image slider plugins.

     jQuery图像滑块插件的精选列表。

That’s all for jQuery tutorial index post. I will keep on adding more tutorials to this list as and when I write more on jQuery.

这就是jQuery教程索引发布的全部内容。 当我在jQuery上编写更多文章时，我将继续在此列表中添加更多教程。

翻译自: https://www.journaldev.com/15222/jquery-tutorial

jquery教程