• 周六. 7 月 27th, 2024

5G编程聚合网

5G时代下一个聚合的编程学习网

热门标签

java 前端-BOM

admin

11 月 28, 2021

 1.   open()  与 opener 用法

 <script type="text/javascript">

        window.onload=function(){

          var button=document.getElementById("btn");
           button.onclick=function(){

               open("sub.html","sdaf");   打开新窗口

            //  open("http://www.baidu.com","baidu");

           }

        }

    </script>
<input type="button" value="submit" id="btn"/>
 <script type="text/javascript">

        window.onload=function(){

            var button=document.getElementById("btn");
            button.onclick=function(){

              //  open("http://www.baidu.com");   打开新窗口
          opener.document.write("父标签写");
                //  open("http://www.baidu.com","baidu");


            }

        }

    </script>
<input type="button" value="submit" id="btn"/>

 2.  location  属性和方法

 <script type="text/javascript">
      //  可以看成我们浏览器输入框
       /* alert(location);
        alert(window.location);
        alert(window.document.location);
        */


      /*window.onload=function(){
              document.onclick=function(){
                  location.hash="#3";
              }


      }*/

           alert(location.hostname);//localhost
           alert(location.host);//localhost:63342
           alert('location.href'+location.href);//http://localhost:63342/untitled/datetimepicker-master20160419/Bom/localtion.html
           alert('location.pathname'+location.pathname);///untitled/datetimepicker-master20160419/Bom/localtion.html
           alert(location.port);//63342
           alert(location.protocol);//http
           alert(location.search);//?username=zhouwuji,passwd=1234

    </script>

<input type="button" value="submit" id="btn"/>
 <script type="text/javascript">
     /*   assign();  跳转到指定的url
        reload();     重载当前的url ,如果传参,参数为true的时候,强制加载,从服务器源头重新加载
        replace();    用新的url替换当前的页面 ,   和assign() 方法区别就是返回不到上一个页面
   */
     window.onload=function(){

         var button=document.getElementById("btn");
         button.onclick=function(){
            // location.assign("http://www.baidu.com");
             // location.reload(true);
             location.replace("http://www.baidu.com");
         }

     }

    </script>
   <input  type="button"  id="btn" value="sumint"/>

三  history  用法

 <!--   history 是windows对象的属性,它保存这个用户的记录
           属性
        history.length  返回当前history对象中记录数,历史记录条数
          方法
        back()  返回上一条历史记录,类似于后退
        forword()   类似于前进
        go()
   -->
    <script type="text/javascript">

        window.onload=function(){
            var button=document.getElementById("btn");
            button.onclick=function(){

                alert(history.length);

            }

            var button1=document.getElementById("btn1");
               button1.onclick=function(){

               // alert(history.length);
              history.back();
            }
            var button2=document.getElementById("btn2");
            button2.onclick=function(){

                history.forward();

            }


            var button3=document.getElementById("btn3");
            button3.onclick=function(){

                history.go(0);//刷次当前
                history.go(2);//往前跳转两页
                history.go(-2);//往后跳转两页
            }
        }

    </script>


</head>
<body>
<input type="button" value="记录" id="btn"/>
<input type="button" value="back" id="btn1"/>
<input type="button" value="forword" id="btn2"/>
<input type="button" value="go" id="btn3"/>
</body>

四 封装函数seach  解析   ?id=5&search=ok&name=admin

  

 <script type="text/javascript">
          // ?id=5&search=ok

          function  getValue(seach, key){
              var start=seach.indexOf(key);
             if (start== -1){
                 return;
             }else{
                 var end=seach.indexOf("&",start);  //查找出start位置之后 &的出现位置
                 if(end == -1){
                     end=seach.length;
                 }
             }
              var  end=seach.substring(start,end);
              var arry=end.split("=");
              return arry[1];
        }

        var seach="?id=5&search=ok&name=admin";
         alert( getValue(seach,"name"));
    </script>

发表回复