Category Archives: Jquery

jQuery Ajax post Method


jQuery Ajax post method loads data from server using the HTTP POST Request.


jQuery Ajax $.post() Method Syntax

$.post(url,function(response,status));

url(Required): Url of the file you want to load.
function : (optional): Callback is executed when the request completes.

jQuery Ajax post method Example


Try it »

Output :

jQuery Ajax post Method

jQuery Ajax post Example


note : post_method_demo.php contains the following code

Post Method Demo

You Posted :





jQuery Ajax get Method


jQuery Ajax get method loads data from server using the HTTP GET Request.


jQuery Ajax $.get() Method Syntax

$.get(url,function(response,status));

url(Required): Url of the file you want to load.
function : (optional): Callback is executed when the request completes.

jQuery Ajax get method Example


Try it »

Note : get_method_demo.php contains the following data which is returned from the server :

Get Method Demo

Data Loaded from server using get method.

jQuery Ajax load Method


jQuery Ajax load method loads data from server and returns data in the specified element.


jQuery Ajax load Method Syntax

$(selector).load(url,data,function(response,status,xhr));

url(Required): Url of the file you want to load.
data(optional): Data returned from server

function : (optional): Callback is executed when the request completes.

jQuery Ajax load Example


Try it »

jQuery Ajax Basic Example


Ajax : Ajax stands for Asynchronous Javascript And Xml. Ajax is used to load data from server without reloading the whole page. In short Ajax loads data from server and updates in the specified part of the page. Now we will give a short jQuery Ajax Basic Example for beginners with syntax.


How to use jQuery with Ajax?

Here we are going to show very basic example of the Ajax using .load() method which will load data from server without the page reload.

jQuery Ajax Basic Example


Try it »

jQuery outerHeight Method


jQuery outerHeight Method : is used to get the height of selected element including the padding and border. OuterHeight method returns total height of the container. Here is syntax and example with complete demo of
jQuery OuterHeight() method.


jQuery outerHeight Method Syntax

Here is syntax for outer Height-

$(selector).outerHeight();

jQuery outerHeight Method Example

Below is example which is showing outerHeight with Example and demo –


Try it »

The above example will produce the following result –

jQuery outerHeight Method

jQuery outerWidth Method


jQuery outerWidth Method : is used to get the width of selected element including the padding and border both. It returns width padding and border ie. outer width = border width + padding + with of container.
We are going to explain this method with example and demo.


jQuery outerWidth Method Syntax

jQuery Syntax for outer with –

$(selector).outerWidth();

jQuery outerWidth Method Example

Here is example for outer with of the container –


Try it »

If you run the above example it will produce the following output-

jQuery outerWidth Method

jQuery innerHeight Method


jQuery innerHeight Method : is used to get the height of selected element including the padding. It does not includes the border width it return height + padding as innerHeight.

Note : It will not add border width while returning the innerWidth.

We are going to explain this method with syntax, example and demo.


jQuery innerHeight Method Syntax

Here is syntax for innerHeight of container –

$(selector).innerHeight();

jQuery innerHeight Method Example

Run below example and see the result –


Try it »

The above example will generate following result –

jQuery innerHeight Method Example

jQuery innerWidth Method


jQuery innerWidth Method : is used to get the width of selected element including the padding.


jQuery innerWidth Method Syntax

$(selector).innerWidth();

jQuery innerWidth() Method Example


Try it »

The Output of the above example is given below which is showing the inner width of the div. This method can be used to find inner width of any element:
Note : It returns the width of element including the padding.

jQuery innerWidth Method

jQuery innerWidth Method

jQuery height Method


jQuery height Method : is used to get or set the height of selected element. If want to add hight of an element dynamically use .height(height) method eg. .height(100) where 100 is height in pixel.


jQuery height Method Syntax 1 Get height

Here is syntax of height method-

$(selector).height();

jQuery height() Method Example 1

Here is an example of height() method


Try it »

Syntax 2 – Set Height

$(selector).height(width);

height(px): Height in pixel.

jQuery height() Method Example 2


Try it »