BOM编程对象

迷南。 2022-02-21 08:19 328阅读 0赞

1.windows对象

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>windows对象</title>
  6. <script>
  7. /*windows对象中常用的方法: 1.open("url","打开方式","打开新窗口的宽高以及设置工具栏的显示") URL:打开的资源文件/资源地址 2.setInterval("任务",毫秒值)//经过多少毫秒重复执行 setTimeout("任务",毫秒值)//经过多少毫秒后执行一次 取消定时器: clearInterval(timerId); clearTimeout(timerId); 3.弹框的方法: alert() confirm()//确认对话框 prompt()//消息对话框和输入框 * */
  8. function testOpen(){
  9. window.open("表单标签02.html","_blank","width:400px;height:400px,toolbar :0",);
  10. }
  11. function test(){
  12. console.log("123");
  13. }
  14. function testInterval(){
  15. taskId = window.setInterval("test()",3000);
  16. }
  17. function testTimeout(){
  18. taskId = window.setTimeout("test()",3000);
  19. }
  20. </script>
  21. </head>
  22. <body>
  23. <input type = "button" value="open" onclick="testOpen()" />
  24. <input type = "button" value="Interval" onclick="testInterval()" />
  25. <input type = "button" value="Timeout" onclick="testTimeout()" />
  26. </body>
  27. </html>

2.location对象

href:改变当前url的地址,实现跳转
reload:重新刷新当前页面

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>location对象</title>
  6. </head>
  7. <script>
  8. /* location对象: href:改变当前url的地址,实现跳转 reload:重新刷新当前页面 * */
  9. function testHref(){
  10. window.location.href = "windows.html";
  11. }
  12. function load(){
  13. window.location.reload();
  14. }
  15. window.setInterval("load()",3000);
  16. </script>
  17. <body>
  18. <input type = "button" value = "点我跳转" onclick = "testHref()" />
  19. </body>
  20. </html>

3.history对象

forward():载入下一个url
back():z载入上一个url
go(整数):装入url代替上面两个方法

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>history对象</title>
  6. </head>
  7. <script>
  8. /* forward():载入下一个url back():z载入上一个url go(整数):装入url代替上面两个方法 * */
  9. function testForward(){
  10. //跳转到目标页面
  11. window.history.forward();
  12. }
  13. </script>
  14. <body>
  15. <a href="history02.html">跳转</a>
  16. <br />
  17. <input type="button" value="前进" onclick="testForward()"/>
  18. </body>
  19. </html>
  20. //history02.html
  21. <!DOCTYPE html>
  22. <html>
  23. <head>
  24. <meta charset="UTF-8">
  25. <title></title>
  26. <script>
  27. function testBack(){
  28. window.history.back();
  29. }
  30. </script>
  31. </head>
  32. <body>
  33. 目标页面
  34. <br />
  35. <input type = "button" value="回退" onclick="testBack()" />
  36. </body>
  37. </html>

发表评论

表情:
评论列表 (有 0 条评论,328人围观)

还没有评论,来说两句吧...

相关阅读

    相关 BOM编程

                                          JavaScript——BOM 什么是BOM编程,BOM和DOM编程的区别,已经写在这里面了,

    相关 BOM对象

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一、什么是BOM 1.window对象 2.window对象

    相关 Javascript - BOM 对象

    浏览器相关的对象。获取浏览器相关的信息,可以设置和修改浏览器属性。 0. web-app 版 TodoList 小程序 用以下内容可以自己手写一个 TodoList 小