JavaScript Location(浏览器地址)

刷新当前页面

reload方法刷新当前页面

<span>当前时间:</span>

<script>

  var d = new Date();

  document.write(d.getHours());

  document.write(":");

  document.write(d.getMinutes());

  document.write(":");

  document.write(d.getSeconds());

  document.write(":");

  document.write(d.getMilliseconds());

function refresh(){

  location.reload();

}

</script> 

<br>

<button onclick="refresh()">刷新当前页面</button>

跳转到另一个页面

<script>

function jump(){

  //方法1

  //location="/";

  //方法2最大的不同是，assign会添加记录到浏览历史，点击后退可以返回之前页面

  location.assign("/"); 

}

</script>

<br>

<button onclick="jump()">跳转到首页</button>

location的其他属性

协议 location.protocol

主机名 location.hostname

端口号 (默认是80，没有即表示80端口)location.port

主机加端口号 location.host

访问的路径 location.pathname

锚点 location.hash

参数列表 location.search:

JavaScript 弹出框

警告框

警告框 alert，常用于消息提示，比如注册成功等等

<script>

function register(){

   alert("注册成功");

}

</script>

<br>

<button onclick="register()">注册</button>

确认框

确认框 confirm，常用于危险性操作的确认提示。 比如删除一条记录的时候，弹出确认框
confirm返回基本类型的Boolean true或者false

<script>

function del(){

var d = confirm("是否要删除");

alert(typeof d + " " + d);

}

</script>

<br>

<button onclick="del()">删除</button>

输入框

输入框 prompt，用于弹出一个输入框，供用户输入相关信息。 因为弹出的界面并不好看，很有可能和网站的风格不一致，所以很少会在实际工作中用到。

<script>

function p(){

var name = prompt("请输入用户名:");

alert("您输入的用户名是:" + name);

}

</script>

<br>

<button onclick="p()">请输入用户名</button>

JavaScript 计时器

只执行一次

函数setTimeout(functionname, 距离开始时间毫秒数 ); 
通过setTimeout在制定的毫秒数时间后，执行一次 函数functionname ，本例在3秒钟后，打印当前时间。 
解释: 
document.getElementById 获取id=time的div元素 
.innerHTML 修改该元素的内容 
更多的关于如何获取元素，请参考 HTML DOM 获取元素

<script>

function printTime(){

  var d = new Date();

  var h= d.getHours();

  var m= d.getMinutes();

  var s= d.getSeconds();

  document.getElementById("time").innerHTML= h+":"+m+":"+s;

}

 function showTimeIn3Seconds(){

   setTimeout(printTime,3000); //3秒后执行pringTime方法

}

</script>

<div id="time"></div>

<button onclick="showTimeIn3Seconds()">点击后3秒钟后显示当前时间，并且只显示一次</button>

不断重复执行

函数setInterval(函数名, 重复执行的时间间隔毫秒数 );
通过setInterval重复执行同一个函数，重复的时间间隔由第二个参数指定

<p>每隔1秒钟，打印当前时间</p>

<div id="time"></div>

<script>

function printTime(){

  var d = new Date();

  var h= d.getHours();

  var m= d.getMinutes();

  var s= d.getSeconds();

  document.getElementById("time").innerHTML= h+":"+m+":"+s; 

}

var t = setInterval(printTime,1000);

</script>

<br><br>

终止重复执行

通过clearInterval（）终止一个不断重复的任务

本例，当秒是5的倍数的时候，就停止执行

<p>每隔1秒钟，打印当前时间</p>

<div id="time"></div>

<script>

var t = setInterval(printTime,1000);

function printTime(){

  var d = new Date();

  var h= d.getHours();

  var m= d.getMinutes();

  var s= d.getSeconds();

  document.getElementById("time").innerHTML= h+":"+m+":"+s;

  if(s%5==0)

     clearInterval(t);

}

</script>

<br>

不要在setInterval调用的函数中使用document.write()

部分浏览器，比如firefox有这个问题，其他浏览器没这个问题。

假设setInterval调用的函数是printTime, 在printTime中调用document.write();只能看到一次打印时间的效果。

----------------------------------------------------------------------------------------------------------------------

输入：

var str="How are you doing today?"

document.write(str.split(" ") + "<br />")

document.write(str.split("") + "<br />")

document.write(str.split(" ",3))

输出：

How,are,you,doing,today?

H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?

How,are,you

join() 方法用于把数组中的所有元素放入一个字符串。