机器学习入门之JavaScript学习笔记(四)——进阶篇第八章浏览器对象
小标 2018-11-28 来源 : 阅读 1117 评论 0

摘要:本文主要向大家介绍了机器学习入门之JavaScript学习笔记(四)——进阶篇第八章浏览器对象,通过具体的内容向大家展现,希望对大家学习机器学习入门有所帮助。

本文主要向大家介绍了机器学习入门之JavaScript学习笔记(四)——进阶篇第八章浏览器对象,通过具体的内容向大家展现,希望对大家学习机器学习入门有所帮助。



window对象


window对象方法表:


JavaScript计时器:



一次性计时器:setTimeout()&clearTimeout()


间隔性触发计时器:setInterval()&clearInterval()



setInterval()&clearInterval():


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

语法:setInterval(代码,交互时间);

比如setInterval("clock()", 1000)



代码:要调用的函数或要执行的代码串;


交互时间:周期性执行或调用表达式的时间间隔,以毫秒为单位



返回值:一个可以传递给clearInterval()从而取消对“代码”的周期性执行的值

例子:


  var attime;
  function clock(){
    var time=new Date();          
    attime=time.getHours()+":"+time.getMinutes()+":"+time.getSeconds();
    document.getElementById("clock").value = attime;
  }//把attime的值赋给文本框要显示的值
  var timer = setInterval(clock,1000);//调用函数clock()显示当前系统时间
...
<form>
    <input type="text" id="clock" size="50"  />
    <input type="button" value="Stop" onclik="clearInterval(timer)" />
//clearInterval()取消由setInterval()设置的交互时间
</form>


setTimeout()&clearTimeout()


在载入后延迟指定时间后,去执行一次表达式,仅执行一次


要创建一个运行于无穷循环中的计数器,我们需要编写一个函数来调用其自身:


<script type="text/javascript">
  var num=0;
  var i;
  function startCount(){
    document.getElementById('count').value=num;
    num=num+1;
    i=setTimeout("startCount()",1000);//调用自身实现无穷循环
  }
  function stopCount(){
    clearTimeout(i);//语法:clearTimeout(id_of_setTimeout)
  }
</script>
...
<form>
    <input type="text" id="count" />
    <input type="button" value="Start" onClick="startCount()" />
    <input type="button" value="Stop"  onClick="stopCount()" />
</form>



history对象


history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能。从窗口被打开的那一刻开始记录,每个浏览器窗口、每个标签页乃至每个框架,都有自己的history对象与特定的window对象关联。


语法:window.history.[属性方法]  //window可以省略


history对象属性:length,返回浏览器历史列表的URL数量


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


history对象方法:



back()  window.history.back();


forward()  window.history.forward();


go()  window.history.go(number);


location对象


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



语法:location.[属性方法]


location对象属性图示:



location对象属性:


属性                描述
hash            设置或返回从'#'开始的URL(锚)
host             设置或返回主机名和当前的URL端口号
hostname    设置或返回当前URL的主机名
href              设置或返回完整的URL
pathname    设置或返回当前URL的路径部分
port              设置或返回当前URL的端口号
protocol        设置或返回当前URL的协议
search           设置或返回从'?'开始的URL(含查询部分)


location对象方法:



assign():加载新的文档


reload():重新加载当前文档


replace():用新文档替换当前文档


navigator对象


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

语法:navigator.属性



对象属性:


属性                        描述
appCodeName        浏览器代码名的字符串表示
appName            浏览器名称
appVersion         浏览器的平台和版本信息
platform           运行浏览器的操作系统平台
userAgent          由客户机发送服务器的user-agent头部的值


userAgent


userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头(user-agent header)的值


一般来讲,它是在 navigator.appCodeName 的值之后加上斜线和navigator.appVersion的值构成的

例如:Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.2; SV1; .NET CLR 1.1.4322)

(参考W3Cschool)



screen对象


用于获取用户的屏幕信息


语法:  window.screen.属性  //window可省略


属性:



availHeight:  窗口可以使用的屏幕高度(像素)


availWidth:  窗口可以使用的屏幕宽度(像素)


colorDepth:  用户浏览器表示的颜色位数,通常为32位(每像素的位数)


pixelDepth:  用户浏览器表示的颜色位数,通常为32位(每像素的位数)【IE不支持此属性】


height:  屏幕高度



width:  屏幕宽度



练习题


要求:

如果打开该页面后,如果不做任何操作则5秒后自动跳转到一个新的地址,如慕课网主页;

如果点击“返回”按钮则返回前一个页面


<body>
<!--先编写好网页布局-->
<h1>操作成功</h1>
<span id="second" >5</span>秒后回到主页<a href="javascript:back();">返回</a>

<script type="text/javascript">  
var num = document.getElementById("second").innerHTML;//给num赋予"second"XX值,5
function count(){
    num--;
    document.getElementById("second").innerHTML = num;//改变"second"XX值为num现在的值(num--)
    if(num==1){
        location.assign("//www.imooc.com");
    }    
}
setInterval("count()",1000);
function back(){//可以删掉这个
   window.history.back();
}  
</script> 
</body>


还可以通过在count()函数内部加setTimeout(count, 1000);,函数外部加setTimeout(count, 1000);来代替setInterval(count, 1000)


本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标人工智能机器学习频道!

本文由 @小标 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式AI+学习就业服务平台 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved