JavaScript(3)

目录

    • 一 、基于编程式的事件绑定
    • 二、 典型案例
    • 三、 BOM编程 (Browser Object Model)
    • 四、 外部js文件
    • 五、bom操作中的定时器函数

一 、基于编程式的事件绑定

JavaScript(3)_第1张图片
解决方案:使用编程式事件绑定
语法:标签Dom对象.事件属性名 = 函数;
JavaScript(3)_第2张图片

二、 典型案例

  1. 表单校验

大致思路:
1.在每个表单元素后面添加一个空的提示信息的标签。
2.在每个表单元素上面添加onblur事件判断该文本框是否满足条件,不满足就提示错误信息。
3.在表单上面添加onsubmit事件当提交表单时调用每个onblur事件对应的方法。

JavaScript(3)_第3张图片
2. 级联下拉列表
JavaScript(3)_第4张图片

三、 BOM编程 (Browser Object Model)

使用浏览器提供内置对象进行编程,从改变浏览器本身一些效果。
window
window的方法和属性在使用时可以省略window.
方法:
      alert()
      confirm()

属性:
      location
      通过修改location值可以发起新的请求

事件:
      onload 在页面加载完毕之后执行,等价于body里面的onload事件

案例:confirm和location的用法
JavaScript(3)_第5张图片
在实际开发中confirm的用法:
JavaScript(3)_第6张图片

四、 外部js文件

  1. 把原文件中js代码抽取到一个文件中
        注意:文件名后缀以.js结尾
        文件中直接写js代码,不用写script标签
    JavaScript(3)_第7张图片
  2. 在页面中使用script标签引入外部js文件
    JavaScript(3)_第8张图片

五、bom操作中的定时器函数

他们都是bom操作中的内容,可以使用window调用。
     setTimeout(函数,时间ms); 延迟一定时间执行函数,返回一个延迟执行的函数标识
     clearTimeout(函数标识); 清除要延迟执行的函数
JavaScript(3)_第9张图片
     setInterval(函数,间隔时间ms); 每隔一段时间执行一次函数,返回一个函数标识
     clearInterval(函数标识); 清除间隔执行的函数
JavaScript(3)_第10张图片

你可能感兴趣的:(笔记)