SoFunction
Updated on 2025-03-03

Detailed explanation of window location and history objects in JavaScript programming

Window Location

  • The object is used to obtain the address (URL) of the current page and redirect the browser to the new page.
  • The prefix of window can be used when writing objects. Some examples:
  • Some examples:
  • Return the domain name of the web host
  • Return the path and file name of the current page
  • Returns the port of the web host (80 or 443)
  • Returns the web protocol used (http:// or https://)

Window Location Href

Properties return the URL of the current page.
Example
Returns the entire URL (of the current page):

<script>

();

</script>



Window Location Pathname
The property returns the pathname of the URL.
Example
Return the pathname of the current URL:

<script>

();

</script>

The above code output is:

/js/


Window Location Assign
The () method loads the new document.
Example
Load a new document:

<html>
<head>
<script>
function newDoc()
 {
 ("http://")
 }
</script>
</head>
<body>

<input type="button" value="Load new document" onclick="newDoc()">

</body>
</html>


Window History
The prefix of window can be used when writing objects.
To protect user privacy, restrictions are placed on how JavaScript accesses the object.
Some methods:

  • () - Same as clicking the back button in the browser
  • () - Same as clicking the button forward in the browser

Window History Back

The () method loads the previous URL in the history list.
This is the same as clicking the back button in the browser:
Example
Create a back button on the page:

<html>
<head>
<script>
function goBack()
 {
 ()
 }
</script>
</head>
<body>

<input type="button" value="Back" onclick="goBack()">

</body>
</html>


Window History Forward
The history forward() method loads the next URL in the history list.
This is the same as clicking the forward button in the browser:
Example
Create a forward button on the page:

<html>
<head>
<script>
function goForward()
 {
 ()
 }
</script>
</head>
<body>

<input type="button" value="Forward" onclick="goForward()">

</body>
</html>