Home > Article > Web Front-end > An in-depth analysis of the window.location object to implement page jumps
An in-depth analysis of the window.location object to implement page jumps
- WBOYforward
- 2022-08-05 10:57:583094browse
This article brings you relevant knowledge about javascript, which mainly introduces the issues related to the window.location object to achieve page jump. The window.location object is used to obtain the address of the current page. , and redirect the browser to a new page. Let’s take a look at it. I hope it will be helpful to everyone.
[Related recommendations: javascript video tutorial, web front-end】
window.location object is used Get the address (URL) of the current page and redirect the browser to the new page.
window location The object can be written without using the Window prefix. Some examples:
- location.hostname returns the domain name of the web host
- location.pathname returns the path and file name of the current page
- location.port returns the web host's Port
- location.protocol returns the web protocol used
window location href
##Example
Return the URL of the current page:<script type="text/javascript"> document.write(location.href); </script>The output of the above code is:
http://127.0.0.1:8848/7.11/new_file.html
window location pathname
location.pathname property returns the URL pathname.Example
Return the path name of the current URL:<script type="text/javascript"> document.write(location.pathname); </script>The output of the above code is:
/7.11/new_file.htmlwindow location AssignThe location.assign() method loads a new document.
Example
Load a new document:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="button" name="" id="" value="跳转到百度" onclick="newDoc()"/>
<script type="text/javascript">
function newDoc(){
window.location.assign('https://www.baidu.com')
}
</script>
</body>
</html>
Use javascript to implement page timing jump---location object
Requires the following effects:
- #Write an HTML page for scheduled jumps.
- #Get the specified number of seconds and subtract 1 to write to the page.
- When the number of seconds is greater than 0, use setTimeout() to count down in a loop.
- #When the number of seconds is less than or equal to 0, use location.href to jump to the specified URL address.
The implementation code is as follows: html code:
css code:
js code:
Achievement effect:
【Related recommendations:
javascript video tutorialThe above is the detailed content of An in-depth analysis of the window.location object to implement page jumps. For more information, please follow other related articles on the PHP Chinese website!