jQuery Multiple Function Chaining Joining
jquery jQuery Multiple Function Chaining Joining Jquery Concatenation The Functions
How to join two or more jQuery function at a single satement?
As per jQuery's slogan 'Write less, do more' we can perform number of functions in a single line statement without accessing the HTML element again and again.
Syntax of jQuery Chaining
$("TagSelector").functionName().functionName(); //Syntax
$("#mydiv").fadeIn('slow').animate({ left:'100px'}); //Example
Let's go through an example.
jQuery function chaining to multiple function with single statement
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button id="mybutton">Click To Perform Multiple jQuery functions</button>
<div id="mydiv" style="display:none; position:relative;">Write Less ,Do More With jQuery</div>
<script>
$("#mybutton").click(function(){
$("#mydiv").fadeIn(2000).animate({ left:'100px',} , "slow")
.animate({ left:'-25px'} , "slow");
});
</script>