Get and Set Value of Label using JQuery

JQuery

JQuery is light weight javascript library and main role of jquery easily use javascript on your website.

Syntax of jquery:

$(Selector).action();

  1. $ Symbol to access jquery
  2. Selector is used to find HTML element
  3. Action is used for perform action on element

This Article, I want to explain Get and Set value of label using JQuery:

A. Get Value from Label

  1. alert($('#lbl').html());  
B. Set value to Label
  1. $('#lbl').val("Vishvajeet")  
  2. $("#lbl").html("Vishvajeet")  
  3. alert($('#lbl').val());  
Example:
  1. <html xmlns="http://www.w3.org/1999/xhtml">  
  2. <head id="Head1" runat="server">  
  3. <title></title>  
  4. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>  
  5. <script type="text/javascript">  
  6.     $(document).ready(function () {  
  7.         $('#btnGet').click(function () {  
  8.             //Get value  
  9.             alert($('#lbl').html());  
  10.         })  
  11.         $('#BtnSet').click(function () {  
  12.             // Set value  
  13.             $('#lbl').val("Set Value :- Vishvajeet")  
  14.             $("#lbl").html("Set Value :- Vishvajeet")  
  15.             alert($('#lbl').val());  
  16.         })  
  17.     });  
  18. </script>  
  19. </head>  
  20. <body>  
  21. <form id="form2" runat="server">  
  22. <br />  
  23. <div style="padding-left:100px">  
  24. <asp:Label ID="lbl" runat="server" Text="Vishvajeet Pawar"></asp:Label>  
  25. <br />  
  26. <asp:Button ID="btnGet" runat="server" Text="Get Value" />  
  27. <asp:Button ID="BtnSet" runat="server" Text="Set Value" />  
  28. </div>  
  29. </form>  
  30. </body>  
  31. </html>  
A. Form Design:

                           get value

B. Get Value from Label:

                           get value at local host

C. Set value to the Label:


                              set value