Fundamentals of Web development JavaScript-16

Keywords: Javascript Session

Common properties of window in JS

Case demonstration:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>window Common attributes</title>
		<script type="text/javascript">
			//Hyperlink and location can realize page Jump,
			//Hyperlinks are simple, but location is more flexible.
			function boke(){
				var b = confirm("Are you sure you want to leave this page?");
				if(b){
					//Modify the address of the page
					location.href = "https://blog.csdn.net/coder_boy_";
				}
			}
			
			function refresh(){
				//Refresh page
				location.reload();
			}
		
			function forward(){
				//One step forward
				history.forward();
			}
			
			function screenSize(){
				alert("Total width and height:"
					+screen.width+","+screen.height);
				alert("Available width and height:"
					+screen.availWidth+","+screen.availHeight);
			}
			
			function llq(){
				
				alert(navigator.userAgent);
			}
		</script>
	</head>
	<body>
		<input type="button" value="Blog" 
			onclick="boke();">
		<input type="button" value="Refresh"
			onclick="refresh();">
		<input type="button"  value="Forward"
			onclick="forward();">
		<input type="button" value="Screen size"
		   onclick="screenSize();">
		<input type="button" value="Browser" 
			onclick="llq();">
	</body>

</html>

Final page display effect:


Click "blog" to pop up the prompt box to choose whether to jump


Click OK to jump to the original page, and then click forward to jump to the previously opened page

Click "screen size" to pop up the actual width height and available width height of the screen in sequence:



Click "browser" and information about browser will pop up

[value of the user agent header the browser uses for HTTP requests]


Knowledge development:

Window.history keeps the website access records of users during a session. Each time a user visits a new URL, a new history is created.

history.go(),history.back(),history.forward()

history.back() and history.forward() represent the back page and the front page, respectively.

history.go(num) indicates how many pages to turn forward or backward, num is a positive number to turn forward, and a negative number to turn backward.

History.back() is equivalent to history.go(-1), and history.forward() is equivalent to history.go(1).


Posted by tryton on Sat, 15 Feb 2020 08:55:11 -0800