• JavaScript学习总结(六)


    我们知道,JavaScript共由三部分组成:EMCAScript(基本语法)、BOM(浏览器对象模型)、DOM。
    在浏览器对象模型中,把浏览器的各个部分都用了一个对象进行描述,如果我们要操作浏览器的一些属性,就可以通过浏览器对象模型的对象进行操作

    下面我们来介绍一下浏览器对象模型的基本的对象:

    window  代表了一个新开的窗口
    location 代表了地址栏对象。
    screen  代表了整个屏幕的对象

    window对象常用的方法

    //open()   打开一个新的窗口(参数一:打开的地址,参数二:是否为新的浏览器窗口,参数三:新窗口属性,参数四:用来替代的地址)
    window.open("2.html","_blank","height=400px,width=600px,toobar=no,location=yes,top=200px","用来替代的地址");
    
    //resizeTo() 将窗口的大小更改为指定的宽度和高度值
    window.resizeTo(300,200);
    
    //moveBy()  相对于原来的窗口移动指定的x、y值
    window.moveBy(100,0);//谷歌浏览器貌似不支持了
    
    //moveTo() 将窗口左上角的屏幕位置移动到指定的 x 和 y 位置。 
    window.moveTo(100,0);//谷歌浏览器貌似不支持了
    
    //setInterval() 每经过指定毫秒值后就会执行指定的代码
    
    
    //clearInterval() 根据一个任务的ID取消的定时任务
    
    
    //setTimeout() 经过指定毫秒值后执行指定 的代码一次
    
    

    事件

    定义:当发生一个事件之后,会触发特定的方法
    那么如何注册一个事件呢?

    • 事件的注册方式
     //方式一: 直接在html元素上注册
    <body onload="ready()">
    
        function ready(){
          alert("body的元素被加载完毕了.."); 
        }
    
    
    //方式二:先在js代码找到对应的对象再注册,一般推荐使用这种方式,可以增强可维护性
    
    var bodyNode = document.getElementById("body");
    
        bodyNode.onload = function(){
            alert("body的元素被加载完毕");  
    } 
    • 常用的事件
    鼠标点击相关:
    onclick 在用户用鼠标左键单击对象时触发。 
    ondblclick 当用户双击对象时触发。 
    onmousedown 当用户用任何鼠标按钮单击对象时触发。 
    onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。 
    
    鼠标移动相关:
    onmouseout  当用户将鼠标指针移出对象边界时触发。 
    onmousemove 当用户将鼠标划过对象时触发。 
    
    焦点相关的:
    onblur 在对象失去输入焦点时触发。 
    onfocus 当对象获得焦点时触发。
    
    其他:
    onchange 当对象或选中区的内容改变时触发。 
    onload 在浏览器完成对象的装载后立即触发。 
    onsubmit 当表单将要被提交时触发。 

    location对象

    此对象是浏览器地址栏对象,所以我们能够改变地址栏信息,或者进行其他的一些改变。
    想要获取到url只需要使用location.href即可。
    有两个比较常用的东西:

    //href : 设置以及获取地址栏的对象
    location.href = "http://www.baidu.com";//每天总在莫名其妙的给百度打广告。。
    
    //reload() 刷新当前的页面
    location.reload();

    screen对象

    • 常用的方法
    availHeight 获取系统屏幕的工作区域高度,排除 Microsoft Windows 任务栏。     
    availWidth  获取系统屏幕的工作区域宽度,排除 Windows 任务栏。   
    height      获取屏幕的垂直分辨率。 
    width       获取屏幕的水平分辨率。 
    • 使用方法
    document.write("获取系统屏幕的工作区域高度:"+screen.availHeight+"<br/>");
    document.write("获取系统屏幕的工作区域宽度:"+screen.availWidth+"<br/>");
    document.write("获取屏幕的垂直分辨率:"+screen.height+"<br/>");
    document.write("获取屏幕的水平分辨率:"+screen.width+"<br/>");

    这一讲我们学习的是BOM(浏览器对象模型)
    从下一节开始,我们将开始学习JavaScript的最后一个部分,DOM编程。

  • 相关阅读:
    高性能MySQL笔记(第十一章 可扩展的MySQL)01
    高性能MySQL笔记(第十章 复制)02
    高性能MySQL笔记(第十章 复制)01
    高性能MySQL笔记(第六章 查询性能优化) 02
    高性能MySQL笔记(一个奇怪的问题)
    高性能MySQL笔记(第六章 查询性能优化) 01
    高性能MySQL笔记(第五章 创建高性能的索引) 02
    高性能MySQL笔记(第五章 创建高性能的索引) 01
    [Luogu] P1438 无聊的数列 | 线段树简单题
    [UCF HSPT 2021] Sharon’s Sausages | 思维 暴力
  • 原文地址:https://www.cnblogs.com/roobtyan/p/9576721.html
Copyright © 2020-2023  润新知