Tag Archives: jquery training course
JavaScript get current url
JavaScript get current url- Working with JavaScript we sometimes need to get current url of the address. There are several ways to get the current url of the web page. It can be useful when you are working with javascript and need to redirect on current url or want to perform some other action with url. Here in this tutorial we are going to explain the ways how we can get the current url with several example which might be helpful for us. Let us go with very basic examples which will make the things clear to understand.
JavaScript get current url
You can get the current url simply in javascript as –
JavaScript get current url :
|
|
The above example will give you the full url with query strings.
More About Current Url In JavaScript
Let us have more information about the current url in javascript-
JavaScript get current url parameters
Some times we only need the url parameters in javascript.
JavaScript get current url parameters:
|
|
In the above example we have created a function which accepts parameter name from query string and will give you its value if it is found.
Javascript Current url protocal name
If you want to get the protocal you can use the below method to get the protocal from url in javascript.
JavaScript get query strings from url:
|
|
location.protocal gives the protocal name from the current url example - http::, https::.The above example will give the protocal name from url.
Javascript Current url hostname
If you want to get the hostname only you can use the below method to get the hostname from url in javascript.
JavaScript get query strings from url:
|
|
The above example will give the hostname from url. location.hostname is used to get the hostname from the current url in javascript.
JavaScript get current url without parameters
Some times we only need the url without parameters in javascript. Here is simple example to get the current url without parameters-
JavaScript get current url without parameters:
|
|
In the above example will give you the current url without parameters.
JavaScript get query strings from url
If you want to get the query strings only you can get as below -
JavaScript get query strings from url:
|
|
The above example will give the query string from url. location.pathname will give you the query string from the current url in javascript.
jQuery get selected option value
jQuery get selected option value: You can get selected option value of html select box as below.
Syntax : jQuery get selected option value
Syntax to get selected option value of dropdown menu can be as :
Suppose we have following drop down list
You can get selected value in jquery as :
$("#demo").change(function () {
$("#demo :selected").attr('value');
});
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 –
The above example will produce the following result –
jQuery css Method
jQuery css Method : is used to add the css styles to the selected elements.
Syntax 1
$(selector).css(propertyName);
propertyName(String): Css Style to be added.
jQuery css() Method Example 1
Syntax 2 for jQuery css Method
$(selector).css(propertyNames);
propertyNames (Array): List of styles in form of array.
Example : {‘background’:’yellow’,’font-size’:’24px’,’border’:’2px solid red’}
jQuery css() Method Example 2
jQuery replaceAll Method
jQuery replaceAll Method : is used to replace the selected element with another element. It replaces in all matching selector element with the given content.
We are going to explain this method with example and demo.
jQuery replaceAll Method Syntax
Syntax for replaceAll method –
$(content).replaceAll(selector);
jQuery replaceAll Method Example
Here is an example of replaceAll method Click on Try it button to see the output-
When you run above example it will produce the following output –
jQuery wrap Method
jQuery wrap method : is used to cover the selected element with another element.
Syntax
$(selector).wrap(element);
jQuery wrap Method Example
jQuery insertAfter Method
jQuery insertAfter method : This is used to insert new html element(content) After the specified element. If You want to add some content after a specified element use the jQuery insertAfter Method. The $(content).insertAfter(selector) is used to select and insert content.
Syntax for jQuery insertAfter
Here is syntax to add content(insertAfter) after selected element using jQuery-
$(content).insertAfter(selector);
jQuery insertAfter Method
The above code will produce following result-
Note : This is screenshot of the output. To run this demo click on the above “Try it” button.
jQuery text method
jQuery text method : is used to read or write the text in the html.
Syntax of jQuery text() method
Get Text
$(selector).text();
Note : It does not accepts any argument.
jQuery text Method with syntax
Set Text
$(selector).text(text);
text: String,Number or Boolean to be set as content.
jQuery text Method with syntax
jQuery has Method Example
jQuery “has() Method ” is used to select all elements which have descendants that matches the selector element.
Syntax : jQuery has() method
$(selector).has(element);
element : Required , is used to match the elements against.
