JQuery — advanced


JQuery — advanced

Blog description

The information involved in this article comes from the Internet and personal summary, which means personal learning and experience summary. If there is any infringement, please contact me to delete it. Thank you!


Three ways to show and hide elements
  1. Default display and hide methods

    • Show ([speed, [easing], [FN]), parameters:

      1. Speed: the speed of the animation. Three predefined values (“slow”, “normal”, “fast”) or a number of milliseconds representing the duration of the animation (e.g. 1000)
      2. Easing: used to specify the switching effect. The default is “swing”. The parameter “linear” is available

        • Swing: the effect of animation execution is slow at first, fast in the middle, and slow at last
        • Linear: the speed of animation execution is uniform
      3. FN: the function executed at the end of the animation, once per element.
    • hide([speed,[easing],[fn]])
    • toggle([speed],[easing],[fn])
  2. Slide show and hide mode

    • slideDown([speed],[easing],[fn])
    • slideUp([speed,[easing],[fn]])
    • slideToggle([speed],[easing],[fn])
  3. Fade show and hide

    • fadeIn([speed],[easing],[fn])
    • fadeOut([speed],[easing],[fn])
    • fadeToggle([speed,[easing],[fn]])


The traversal way of JS
  • For (initialization value; loop end condition; step size)
Traversal way of jquery
  1. JQ object. Each (callback)


    JQuery object. Each (function (index, element) {};
    Index: is the index of the element in the collection
    Element: each element object in the collection
    This: each element object in the collection

    Callback function return value:

    • True: if the current function returns false, the loop ends.
    • False: if the current function returns true, the current loop will end and the next loop will continue
  2. $.each(object, [callback])
  3. For.. of: methods provided after jQuery 3.0
    For (element object of container object)

Event binding

  1. Binding method of jQuery standard

    • JQ object. Event method (callback function);
    • Note: if the event method is called and the callback function is not passed, the browser default behavior will be triggered.

      • Form object. Submit(); / / let the form submit
  2. On bind event / off unbind

    • JQ object. On (“event name”, callback function)
    • JQ object. Off (“event name”)

      • If the off method does not pass any parameters, all events on the component are unbound
  3. Event switching: Toggle

    • JQ object. Toggle (FN1, FN2…)

      • When you click the component corresponding to the JQ object, FN1 will be executed. The second click will execute FN2
    • Note: the. Toggle() method in version 1.9 is removed, and the jQuery migrate plug-in can restore this function.

      <script type="text/javascript" charset="utf-8"></script>

plug-in unit

Enhance the function of jquery

Implementation mode:

  1. $.fn.extend(object)

    • Enhance the function of objects obtained through jQuery $(“ා ID”)
  2. $.extend(object)

    • Enhance the function of jqeury object itself $/ jquery


Black horse programmer

Omnipotent network

And industrious self

Recommended Today

Detailed explanation and practice of redfish next generation data center management standard

preface Looking at the current server from the previous closed source management systems, such as Dell’s OpenManage and Idrac, Huawei’s IBMC, HP’s OneView and ILO, Lenovo’s xclarity and xclarity controller’s embedded management, imm2 (acquired from IBM’s systemx PC) Server Series) are actively embracing open source automation tools such as ansible. In this case, redfish, known […]