6-CSS DOM和Event DOM

最新推荐文章于 2022-10-22 10:15:00 发布

佼人僚兮

最新推荐文章于 2022-10-22 10:15:00 发布

阅读量373

点赞数

分类专栏： JavaScript 文章标签： CSSDOM eventDOM

本文链接：https://blog.csdn.net/ZacharyUE/article/details/51216890

版权

6 篇文章 0 订阅

订阅专栏

CSS DOM简介

使用JS操作CSS中的各个属性。

JS只能操作或修改行内样式，px不能省略。对于类样式，通过className来赋值。外联式不能操作。

style对象

每个HTML标记，都有一个style属性。这个属性又是一个style对象，style对象的属性与CSS一一对应。因此，用style对象来代替CSS。

style对象属性与CSS属性的转换

Event DOM

1、事件简介

实现用户与网页的交互。当事件发生时，去执行JS功能代码。

2、常用事件

3、事件句柄属性

HTML标记，都有相应的事件属性。每一个HTML标记，都对应一个元素对象，元素对象也具有相应的事件属性。但是，元素对象的事件属性应该是全小写。事件属性后面调用的一般是JS函数，通过JS函数来完成相应的功能。

4、Event对象简介

当事件发生时，向调用函数，传递一个event参数，这个event参数是一个事件对象。该event对象中记录了当前事件发生的环境信息。如单机时的坐标，事件类型等。

注意：这个event对象是“短暂”存在的，新的事件发生，新的event对象产生，原来的event对象就消失了。

5、DOM中的event对象

DOM中引入event对象（DOM浏览器就是标准浏览器）
- 通过HTML标记的事件属性来传递event对象
  - 在DOM中，event对象是作为事件调用函数时的参数，传递，如οnclick=“get_xy(event)”
DOM中event对象属性
- type：当前的事件类型
- clientX和clientY：距离窗口左边和上边的距离
- pageX和pageY：距离网页左边和上边的距离
- screenX和screenY：距离屏幕左边和上边的距离

6、IE中event对象

表格对象的属性

一个<table>标记，对应一个table对象。

关注