[JavaScript基础]学习⑧---window/计时器/Location/Navigator

window对象

Paste_Image.png
 var mymessage=window.confirm("欢迎来到慕课网");
 if(mymessage){
        window.open('http://www.imooc.com','_blank','width=600,height=400');
}

JavaScript 计时器

Paste_Image.png

setInterval()

从载入页面后每隔指定的时间执行代码

setInterval("clock()",1000)
或
setInterval(clock,1000)
var int=setInterval(clock, 100)
  function clock(){
    var time=new Date();
    document.getElementById("clock").value = time;
  }
 var attime;
  function clock(){
    var time=new Date();          
    attime=  time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();
    document.getElementById("clock").value = attime;
  }
  
  setInterval(clock,100);

clearInterval()

var i=setInterval("clock()",100);
  <input type="button" value="Stop" onclick="clearInterval(i)"  />

setTimeout()

var num=0;
function startCount() {
   document.getElementById('count').value=num;
   num=num+1;
   setTimeout("startCount()",1000);
   document.getElementById('count').value=num;
}
  
<body onload="startCount()">
<form>
<input type="text" id="count" />
</form>
</body>

clearTimeout()

i=setTimeout("startCount()",1000);
clearTimeout(i);

History 对象

History 对象属性

Paste_Image.png

History 对象方法

Paste_Image.png
var HL = window.history.length;
document.write(HL);

window.history.back()

window.history.back();

==

window.history.go(-1);

forward()

返回下一个浏览的页面

window.history.forward();

==

window.history.go(1);

window.history.go(number);

Paste_Image.png
window.history.go(-2);
window.history.go(3);

Location对象

location用于获取或设置窗体的URL,并且可以用于解析URL。

Paste_Image.png
Paste_Image.png

Navigator对象

Navigator 对象包含有关浏览器的信息,通常用于检测浏览器与操作系统的版本。

Paste_Image.png
var browser=navigator.appName;
var b_version=navigator.appVersion;
document.write("Browser name"+browser);
document.write("<br>");
document.write("Browser version"+b_version);
Browser nameNetscape
Browser version5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36

navigator.userAgent

返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串)

Paste_Image.png

判断使用的是什么浏览器

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>navigator</title>
<script type="text/javascript">
  function validB(){ 
    var u_agent = navigator.userAgent; 
    var B_name="不是想用的主流浏览器!"; 
    if(u_agent.indexOf("Firefox")>-1){ 
        B_name="Firefox"; 
    }else if(u_agent.indexOf("Chrome")>-1){ 
        B_name="Chrome"; 
    }else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){ 
        B_name="IE(8-10)";  
    }
        document.write("浏览器:"+B_name+"<br>");
        document.write("u_agent:"+u_agent+"<br>"); 
  } 
</script>
</head>
<body>
  <form>
     <input type="button" value="查看浏览器" onclick="validB()"  >
  </form>
</body>
</html>
浏览器:Chrome
u_agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.101 Safari/537.36

window.screen.属性

Paste_Image.png

screen.width

屏幕分辨率的高和宽

document.write( "屏幕宽度:"+screen.width);//1920
document.write( "屏幕高度:"+screen.height);//1080   

screen.availWidth

屏幕可用高和宽度
creen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如任务栏。

document.write("可用宽度:" +screen.availWidth);//1920
document.write("可用高度:" +screen.availHeight);//1080
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容