Can I use multiple versions of jQuery on the same page?

Can multiple versions of jQuery be used on the same page? This is generally not recommended as it may increase code complexity and introduce potential conflicts. If absolutely necessary, you can use jQuery's noConflict() method to handle conflicts between different versions.

Using the noConflict() Method:

1. Include Multiple Versions of jQuery
   In your HTML file, include the required versions of the jQuery library as needed. For example:

   html
   <script src="jquery-1.12.4.min.js"></script>
   <script src="jquery-2.2.4.min.js"></script>

2. Release Control Over the $ Symbol
   Once the new version is included, immediately call the noConflict() method to transfer control from the new version to the old version or other libraries. For example:

   javascript
   <script>
       var jq1_12 = $.noConflict(true);
   </script>

   The true parameter ensures complete release of control over $ and jQuery, allowing you to create unique aliases for each version.

3. Use Aliases to Operate on Specific Versions of jQuery
   By assigning different aliases to each version, you can explicitly use specific versions of jQuery on the same page, preventing functionality conflicts. For example:

   javascript
   <script>
       jq1_12(document).ready(function(){
           jq1_12("button").click(function(){
               jq1_12("p").text("jQuery 1.12.4 is working");
           });
       });
   </script>
   <script src="jquery-3.5.1.min.js"></script>
   <script>
       var jq3_51 = $.noConflict(true);
       jq3_51(document).ready(function(){
           jq3_51("button").click(function(){
               jq3_51("p").text("jQuery 3.5.1 is working");
           });
       });
   </script>

Example Case

Suppose your project has older plugins that only support jQuery 1.12.4, while you also want to leverage new features from jQuery 3.5.1. Using the above method, you can use both versions on the same page, each handling their respective functionality modules, thereby avoiding version conflict issues.

Conclusion

Although technically feasible, using multiple versions of jQuery on the same page should be considered a temporary measure. Whenever possible, it is better to update your code and plugins to use a single version of jQuery to reduce maintenance complexity and improve page performance.