zoukankan      html  css  js  c++  java
  • javascript实战演练,制作新按钮,‘新窗口打开网站’,点击打开新窗

    通过练习javascript中的document.write()输出展示;消息弹出框alert(字符串或变量);消息对话框confirm(str);用户交互的信息prompt(str1, str2);打开新窗口window.open([URL], [窗口名称], [参数字符串]);window.close();//关闭本窗口或者是<窗口对象>.close();//关闭指定的窗口的学习,下面根据要求测试:

    要求:

    1、新窗口打开时弹出确认框,是否打开

    提示: 使用 if 判断确认框是否点击了确定,如点击弹出输入对话框,否则没有任何操作。

    2、通过输入对话框,确定打开的网址,默认为 https://www.cnblogs.com/dhnblog/

    3、打开的窗口要求,宽400像素,高500像素,无菜单栏、无工具栏。

    个人代码展示:

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8">
     5         <title>编程练习挑战</title>
     6         <script type="text/javascript">
     7         function rec(){
     8             // var ceshi=confirm("新窗口打开时弹出确认框,是否打开")
     9             var ceshi=prompt('新窗口打开时弹出确认框,是否打开','https://www.cnblogs.com/dhnblog/');
    10             if(ceshi!=null){
    11                 window.open('https://www.cnblogs.com/dhnblog/','_blank','width=400px,height=500px,menubar=no,toolbar=no')
    12             }
    13             else{
    14                 document.write('haode')
    15             }
    16         }
    17         </script>
    18     </head>
    19     <body>
    20         <input type="button" name="" id="" value="新窗口打开网站" onclick="rec()"/>
    21     </body>
    22 </html>

     正确代码展示:

     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="utf-8">
     5         <title>浏览器对象</title>
     6         <script type="text/javascript">
     7             function ceshi(){
     8                 if(confirm('确定打开新窗口吗'))
     9                 {
    10                     var url=prompt('请输入一个网址','https://www.baidu.com/');
    11                     window.onpen(url,'_blank','toolbar=no,menubar=no,scrollbars=yes,width=400,height=400');
    12                 }
    13             }
    14         </script>
    15     </head>
    16     <body>
    17         <input type="button" name="" id="" value="新窗口打开网站" onclick="ceshi()" />
    18     </body>
    19 </html>
  • 相关阅读:
    BZOJ3073 Journeys
    UOJ261 【NOIP2016】天天爱跑步 LCA+动态开点线段树
    [bzoj2654] tree 最小生成树kruskal+二分
    【ZJOI2007】【BZOJ1059】矩阵游戏 匈牙利算法
    [Bzoj 2427] [HAOI2010] 软件安装 tarjan缩点+树形DP
    [CQOI2011]放棋子--DP
    BZOJ 3990 排序
    (六)接入层:反向代理,接入层扩容,负载均衡
    (五)伪分布式:你以为,多机就是分布式?
    (四)容量设计:流量高低,对架构究竟有什么影响?
  • 原文地址:https://www.cnblogs.com/webaction/p/12495516.html
Copyright © 2011-2022 走看看