zoukankan      html  css  js  c++  java
  • javaScript---浏览器对象模型(BOM)

    浏览器对象模型中把浏览器 的各个部分都是用了一个对象进行描述,如果我们要
    操作浏览器的一些属性,就可以通过浏览器对象模型的对象进行操作。
    top
    window 代表了一个新开的窗口
    location 代表了地址栏对象。
    screen 代表了整个屏幕的对象

    1.window对象go top

    常用的方法:
    open() 打开一个新的窗口。(可设置工具栏、地址栏、窗口的大小等)
    resizeTo() 将窗口的大小更改为指定的宽度和高度值。
    moveBy() 相对于原来的窗口移动指定的x、y值。
    moveTo() 将窗口左上角的屏幕位置移动到指定的 x 和 y 位置。

    setInterval() 每经过指定毫秒值后就会执行指定的代码。
    clearInterval() 根据一个任务的ID取消的定时任务。
    setTimeout() 经过指定毫秒值后执行指定 的代码一次。

    注意: 使用window对象的任何属性与方法都可以省略window对象不写的。

    Window对象的事件:

    事件:
    注册事件的方式:

    方式一: 直接在html元素上注册

    1 <body onload="ready()">
    2 </body>

    3 <script type="text/javascript"> 4 function ready(){ 5   alert("body的元素被加载完毕了.."); 6 } 7 </script>

    方式二:可以js代码向找到对应的对象再注册。 推荐使用。

    1 var bodyNode = document.getElementById("body");
    2 
    3 bodyNode.onload = function(){
    4   alert("body的元素被加载完毕");    
    5 }

    常用的事件:

    鼠标点击相关:
    onclick 在用户用鼠标左键单击对象时触发。
    ondblclick 当用户双击对象时触发。
    onmousedown 当用户用任何鼠标按钮单击对象时触发。
    onmouseup 当用户在鼠标位于对象之上时释放鼠标按钮时触发。

    鼠标移动相关:
    onmouseout 当用户将鼠标指针移出对象边界时触发。
    onmousemove 当用户将鼠标划过对象时触发。

    焦点相关的:
    onblur 在对象失去输入焦点时触发。
    onfocus 当对象获得焦点时触发。

    其他:
    onchange 当对象或选中区的内容改变时触发。
    onload 在浏览器完成对象的装载后立即触发。
    onsubmit 当表单将要被提交时触发。

     1 function clickTest(){
     2         alert("单击..");    
     3     }
     4     
     5     function dbClick(){
     6         alert("双击..");     
     7     }
     8     
     9 
    10 
    11     function showTime(){
    12         var timeSpan = document.getElementById("timeSpan");
    13         var date  = new Date().toLocaleString();
    14         timeSpan.innerHTML = date.fontcolor("red");
    15     }
    16     
    17     function hideTime(){
    18         var timeSpan = document.getElementById("timeSpan");
    19         timeSpan.innerHTML = "";
    20     }
    21 
    22 
    23     function showInfo(){
    24         var timeSpan = document.getElementById("userName");
    25         timeSpan.innerHTML = "用户名是由6位的英文与数字组成".fontcolor("green");    
    26     }
    27 
    28     function hideInfo(){
    29         var timeSpan = document.getElementById("userName");
    30         timeSpan.innerHTML = "";    
    31     }
    32  
    33     function change(){
    34         alert("城市改变了..");    
    35     }
    View Code

    2.Location(地址栏)对象go top

    href : 设置以及获取地址栏的对象
    reload() 刷新当前的页面

    3.Screen(屏幕)对象go top

    availHeight 获取系统屏幕的工作区域高度,排除 Microsoft Windows 任务栏。
    availWidth 获取系统屏幕的工作区域宽度,排除 Windows 任务栏。
    height 获取屏幕的垂直分辨率。
    width 获取屏幕的水平分辨率。

    1  document.write("获取系统屏幕的工作区域高度:"+screen.availHeight+"<br/>");
    2  document.write("获取系统屏幕的工作区域宽度:"+screen.availWidth+"<br/>");
    3  document.write("获取屏幕的垂直分辨率:"+screen.height+"<br/>");
    4  document.write("获取屏幕的水平分辨率:"+screen.width+"<br/>");
  • 相关阅读:
    Demystifying ASP.NET MVC 5 Error Pages and Error Logging
    分享一个异步任务在遇到IO异常时支持递归回调的辅助方法
    ENode 2.0
    CQRSES架构介绍
    工欲善其事,必先利其器
    写了一个简单的NodeJS实现的进程间通信的例子
    谈一下关于CQRS架构如何实现高性能
    h5可伸缩布局方案
    Android总结之WebView与Javascript交互[转]
    Eclipse将引用了第三方jar包的Java项目打包成jar文件的两种方法[转]
  • 原文地址:https://www.cnblogs.com/gzc911/p/4966408.html
Copyright © 2011-2022 走看看