Analysis of jQuery Plug in Version Conflict

2021-07-10 18:53:16
OfStack

This paper analyzes the handling methods of jQuery plug-in version conflict with examples. Share it for your reference, as follows:

A plug-in of jQuery may have conflicts when there are multiple versions at the same time, resulting in code errors

Refer to the processing method of typeahead, you can add noconflict method in the plug-in to solve this problem (save the old version when entering the version, and restore the old version when exiting)

demo is as follows:


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="jquery.js"></script>
</head>
<body>
<div class="container">
   How do you do 
</div>
<script>
  (function ($) {
    $.fn.myshowHtml = function () {
      alert(" I'm the old version :" + this.html());
    }
  })(window.jQuery);
  (function ($) {
    var old = $.fn.myshowHtml;
    $.fn.myshowHtml = function () {
      alert(" I'm the new version :" + this.html());
    }
    $.fn.myshowHtml.noConflict = function () {
      $.fn.myshowHtml = old;
      return this;
    };
  })(window.jQuery);
  $(function () {
    $(".container").myshowHtml();
    $.fn.myshowHtml.noConflict();
    $(".container").myshowHtml();
  })
</script>
</body>
</html>

More readers interested in jQuery can check the topics of this site: "Summary of Common Plugins and Usage of jQuery", "Summary of Extension Skills of jQuery", "Summary of Switching Special Effects and Skills of jQuery", "Summary of Traversal Algorithms and Skills of jQuery", "Summary of Common Classic Special Effects of jQuery", "Summary of Animation and Special Effects Usage of jQuery" and "Summary of Usage of jquery Selector"

I hope this article is helpful to everyone's jQuery programming.