温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

JavaScript中window对象如何使用

发布时间:2022-08-05 15:47:56 来源:亿速云 阅读:167 作者:iii 栏目:web开发

本篇内容介绍了“JavaScript中window对象如何使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

JavaScript中window对象如何使用

Window对象方法

  • alert() 弹出警告对话框

  • confrim() 在确认对话框显示指定的字符串

  • prompt() 弹出一个提示对话框

  • open() 打开新浏览器对话框并且显示URL或名字引用的文档,并设置创建对话框的属性

  • close() 关闭被引用的对话框

  • focus() 指定对话框放在所有浏览器最前面

  • blur() 指定对话框放在所有浏览器最后面

  • scrollTo(x,y) 把对话框滚动到指定的坐标

  • scrollBy(offsetx,offsety) 按照指定位移量滚动对话框

  • setTimeout(timer) 在指定的毫秒数过后,对传递的表达式求值

  • setInerval(interval) 指定周期性执行代码

  • moveTo(x,y) 将对话框移动到指定坐标

  • moveBy(offsetx,offsety) 将对话框移动到指定的位移量处

  • resizeTo(x,y) 设置对话框大小

  • resizeBy(offsetx,offsety) 按照指定的位移量设置对话框大小

  • print() “打印”

  • navigate(URL) 使用对话框显示URL指定的页面

示例如下:

1、open()

格式:window.open(URL,windowname)

URL:目标链接地址

windowname:新窗口名称

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象open方法</title>
<script>
	
</script>
</head>
<body>
	<script>
		window.open("http://www.nuc.edu.cn/");
	</script>
</body>
</html>

2、close()

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象open方法</title>
<script>
	
</script>
</head>
<body>
	<input type="button" value="关闭" onclick="window.close()"/>
</body>
</html>

3、confirm()

显示带有一段消息以及确认按钮和取消按钮的对话框。(按确认返回 true 按取消返回false)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象confirm方法</title>
<script>
	window.confirm("胡立群最帅");
</script>
</head>
<body>
	
</body>
</html>

JavaScript中window对象如何使用

4、prompt() 

显示可提示用户输入的对话框(按确认,返回输入的值)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象prompt方法</title>
<script>
	window.prompt("请输入验证码");
</script>
</head>
<body>
	
</body>
</html>

JavaScript中window对象如何使用

5、setInterval()

按照指定的周期(以毫秒计)来调用函数或计算表达式  (通俗来讲就是,设置几毫秒运行一次程序)

格式:setInterval ( ‘js代码或者函数’,执行函数或者代码的间隔时间)

<!--方法1-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象setInterval方法</title>
<script>
	setInterval('test();',1000);
	function test(){
		alert("hello world")
	}
</script>
</head>
<body>
	
</body>
</html>



<!--方法2-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象setInterval方法</title>
<script>
	setInterval('alert("hello world");',1000);
	
</script>
</head>
<body>
	
</body>
</html>

JavaScript中window对象如何使用

6、clearInterval()

setInterval则可以一直循环下去,要想停止,可用window.clearInterval( );

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象setInterval方法循环取消方法--clearInterval</title>
<script>
	var 控制循环=setInterval('alert("hello world");',3000);
</script>
</head>
<body>
	<input type="button" value="停止循环" onclick="控制循环=window.clearInterval(控制循环)" >
</body>
</html>

JavaScript中window对象如何使用

7、setTimeout()

setTimeout和setInterval都属于JS中的定时器,可以规定延迟时间再执行某个操作,不同的是setTimeout在规定时间后执行完某个操作就停止了

代码内嵌式

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象setTimeout方法</title>
<script>
	var 控制循环=setTimeout('alert("hello world");',3000);
</script>
</head>
<body>

</body>
</html>

嵌入函数式

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象setTimeout方法</title>
<script>
	var 控制循环=setTimeout('test()',3000);
	function test(){
		alert("hello world");
	}
</script>
</head>
<body>

</body>
</html>

JavaScript中window对象如何使用

8、clearTimeout()

取消由setTimeout方法设置的timeout  (停止setTimeout())

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>window对象setTimeout方法取消方法--clearTimeout</title>
<script>
	var 控制循环=setTimeout('test()',3000);
	function test(){
		alert("hello world");
	}
</script>
</head>
<body>
	<input type="button" value="停止循环" onclick="循环控制=window.clearTimeout(控制循环)">
</body>
</html>

JavaScript中window对象如何使用

“JavaScript中window对象如何使用”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注亿速云网站,小编将为大家输出更多高质量的实用文章!

向AI问一下细节
推荐阅读:
  1. js window对象
  2. Window对象

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI