jQuery | get() Method

In jQuery .get() method loads data from the server by using the GET HTTP request. This method returns XMLHttpRequest object.

Syntax

$.get( url, [data], [callback], [type] )

Parameters

  1. url : String containing the URL at which request is to be sent
  2. data : This is an optional parameter that represents key/value pairs that will be sent to the server.
  3. callback: This optional parameter represents the function which is to be executed whenever the data is loaded successfully.
  4. type : This parameter represents type of data to be returned to the callback function i.e “xml”, “script”, “json”, “html”, “html”, “jsonp”, or “text”.

Example:

  • This PHP code is use to get data when below html program send the HTTP GET request.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    // Result.php file
    <?php
    if( $_REQUEST["name"] ) {
      
       $name = $_REQUEST['name'];
       echo "Welcome ". $name;
    }
      
    ?>

    chevron_right

    
    


  • This HTML code is use to send the HTTP GET request.
    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <html>
      
    <head>
        <script type="text/javascript"
                src=
      </script>
      
        <script type="text/javascript"
                language="javascript">
            $(document).ready(function() {
      
            $("#driver").click(function(event) {
                    $.get(
                     "result.php", {
                         name: "GFG"
                     },
                     function(data) {
                         $('#stage').html(data);
                     });
                });
            });
        </script>
    </head>
      
    <body>
        <p>Click on the button to load result file 
      </p>
      
        <span id="stage" 
              style="background-color:#cc0;">
             GeeksForGeeks
          </span>
      
        <div>
            <input type="button"
                   id="driver"
                   value="Load Data" />
        </div>
      
    </body>
      
    </html>

    chevron_right

    
    

  • Output:
    Before clicking on the button:

    After clicking on the button:



    My Personal Notes arrow_drop_up

    Check out this Author's contributed articles.

    If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

    Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.




    Article Tags :

    Be the First to upvote.


    Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.