As we all know JavaScript is most popular programming or scripting language among programmers, without JavaScript you can't develop a creative website, But if you want to develop such a creative website then you must have some basic knowledge about JavaScript like methods in JavaScript, keywords in JavaScript & JavaScript function, one of them i am gonna tell you in this post, So Let's See.
Here in this post we talk about JavaScript's window.history object, This object will contain browser history and It also contains an array of URL's visited by the user, You can also count the length of the URL visited by the user using length property of window.history object. So Lets See.
Every Website developer should have basic knowledge of JavaScript, Because without JavaScript you can't imagine validation in your website or without validations your website like a man without head, So if you don't wanna look like this so please use JavaScript for validation in your website.
window.history object's Methods :
window.history.go().
window.history.back().
window.history.forward().
Note : You can also use only history object instead of window.history object It alone works fine, Because window part can be removed from window.history, If history object does't work alone then you should try window.history object.
window.history.go() - : This method will loads the given page number, The history.go(distance) function works as same as back and forward button and the one another thing is it also specify the exact page which you want to load.
<!DOCTYPE html>
<html>
<body>
<button onclick="goFunction()">Go To Selected Page</button>
<script>
function goFunction(){
window.history.go(3);
}
</script>
</body>
</html>
<html>
<body>
<button onclick="goFunction()">Go To Selected Page</button>
<script>
function goFunction(){
window.history.go(3);
}
</script>
</body>
</html>
Note : The window.history.go(3) will not works when next 3 page does not exist in history list, This go function works as same as you press forward button 3 times.
window.history.back() - : This method will loads the previous page as same as clicking on the back button of browser.
<!DOCTYPE html>
<html>
<body>
<button onclick="backFunction()">Go Back</button>
<script>
function backFunction(){
window.history.back();
}
</script>
</body>
</html>
<html>
<body>
<button onclick="backFunction()">Go Back</button>
<script>
function backFunction(){
window.history.back();
}
</script>
</body>
</html>
Note : This window.history.back() function will not work if previous page does not exist in the history list. When you click on the Go Back button this button will redirect you on the previous page.
window.history.forward() - : This history.forward method will loads the next page as same as forward button of browser.
<!DOCTYPE html>
<html>
<body>
<button onclick="forwardFunction()">Next Page</button>
<script>
function forwardFunction(){
window.history.forward();
}
</script>
</body>
</html>
<html>
<body>
<button onclick="forwardFunction()">Next Page</button>
<script>
function forwardFunction(){
window.history.forward();
}
</script>
</body>
</html>
Note : This window.history.forward() function will not work, If the next page does not exist in the history list, When you click on the Next Page button this button will open a next page. Both function exactly work same as our browser's back and forward button works.
It looks nice
ReplyDelete