DOM-4

正课: 
1. ***HTML DOM常用对象: 
   Form
2. BOM


1. ***HTML DOM常用对象: 
   Form: 代表一个<form元素
   获取: var form=document.forms[i/id/name];
   属性: .length: 相当于form.elements.length
   方法: .submit() : 专用于手动提交表单
          问题: 用户可能按回车,自动提交
          解决: 表单提交的最后一关是一个事件
             form.onsubmit(): 当表单正式提交前自动触发
       获取*表单*元素: 
              var elem=form.elements[i/id/name];
              更简化: 如果表单元素有name属性:
                               form.name
       方法: .focus() : 让当前表单元素获得焦点










正课:
1. ***BOM
  window
     打开关闭窗口
     窗口大小和位置
     定时器


1. ***BOM:
  什么是: Browser Object Model
      专门操作浏览器窗口的API —— 没有标准
  DHTML对象模型: 
   window 2个角色: 
        1. 代替global作为全局作用域对象
             所有全局函数和全局变量都是window的成员
        2. 封装所有DOM和BOM的API
   包括: 
      history 当前窗口打开后成功访问的历史记录
      location 当前窗口正在打开的URL
      document DOM树的根节点,包含所有网页内容
      screen 当前显示设备的信息
      navigator 浏览器的配置信息(版本,名称,插件,cookie)
      event 定义了浏览器中所有事件


  window: 指代当前浏览器窗口对象
    打开和关闭窗口
    打开: open("url","name")
    关闭: close();
  
    打开一个连接,共有几种方式: 
    1. 在当前窗口打开, 可后退:
       html: <a href="url" target="_self">
       js: open("url","_self");
    2. 在当前窗口打开, 禁止后退:
       js: location.replace("url")
           在当前窗口打开新url,用新url替换history中原有url
       原理:
         history: 保存当前窗口打开后成功访问过的url的历史记录栈
    3. 在新窗口打开,可打开多个:
       html: <a href="url" target="_blank"> 
       js: open("url","_blank");
    4. 在新窗口打开,只能打开一个:
       html:<a href="url" target="name">
       js: open("url","name");
     每个窗口都有一个唯一的name属性
     name: 在内存中唯一标识一个窗口的名称
     规定: 同时只能打开一个相同name的窗口
       预定义: _self : 和当前窗口使用相同的name
                   _blank: 不指定自定义name,由浏览器随机分配


   窗口大小和窗口位置: (了解)
   窗口大小: 
      1. 完整窗口大小:  window.outerWidth/outerHeight
 ***2. 文档显示区大小: window.innerWidth/innerHeight
     调整: 2个机会: 
      1. 在打开窗口时,就规定大小:
         var config="left=?,top=?,width=?,height=?"; 
         open("url","name",config)
      2. 打开窗口后再调整——被禁用
       window.resizeTo(width,height)
       window.resizeBy(width增量,height增量)
   窗口位置: 窗口左上角距屏幕左上角的位置
       window.screenLeft|screenX 
       window.screenTop|screenY
     调整: 
       moveTo(left,top)
       moveBy(left的增量,top的增量)


*****定时器:
  什么是: 让程序按照指定时间执行一项任务
  何时: 
     1. 让程序每隔一段时间间隔反复执行一项任务——周期性
     2. 让程序等待一段时间后自动执行一次任务——一次性
  如何: 
    周期性定时器: 3件事: 
     1. 任务函数task
     2. 启动定时器: 将task放入定时器中,设定时间间隔
         timer=setInterval(task, ms);
        timer是唯一标识一个定时器实例的序号
            强调: task不能加(),因为是传递给定时器去回调执行
     3. 停止定时器: 
         clearInterval(timer);
        问题: 定时器往往需要自动停止
        解决: 在*任务函数*中判断临界值
                  如果未达到临界值,继续执行任务
                  否则 停止定时器


    一次性定时器:  先等待,再执行一次,然后自动释放
    3件事: 
     1. 任务函数task
     2. 启动定时器: 将task放入定时器中,设定等待时间
         timer=setTimeout(task, ms);
     3. 停止定时器: (其实是在执行之前,停止等待)
         clearTimeout(timer);


   定时器原理: 
     定时器中的回调函数,必须在主程序所有语句执行完最后才能开始执行!







    
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值