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>