文档章节

DOM2和DOM3(1)

前端小虾
 前端小虾
发布于 2016/06/07 16:42
字数 673
阅读 17
收藏 0

DOM1主要定义的是html和xml文档的底层结构。DOM2和DOM3在DOM1的基础上引入了更多的交互能力,也支持更高级的xml特性。DOM2和DOM3目的在于扩展DOM API,以满足操作xml的所有需求,同时提供更好的错误处理和特性检测能力。DOM2没有引入新类型,是在DOM1的基础上添加新的方法和属性来增强类型。DOM3即添加了新属性和方法增强类型也引入了新的类型。

 

1、针对xml命名空间的变化

    svg

2、访问元素样式的变化

    style对象

    对于短划线的css属性,必须将其转换为驼峰大小写形式,才能通过js访问。css属性float是js中的保留字,因此不能作为属性名。“DOM2级样式”对象上相应的属性名是cssFloat,firefox,safari,opera,chrome都支持这个属性,ie支持的是styleFloat.

    a、DOM2级样式 为style定义了一些属性和方法。

        cssText : style中的css代码

        length : css属性的数量

        parentRule : css信息的cssRule对象

        getPropertyCSSValue(propertyName)

        getPropertyPriority(propertyName)

        getPropertyValue(propertyName)

        item(index):给定位置css属性的名称

        removeProperty(propertyName) : 从样式中删除给定属性

        setProperty (propertyName,value,priority): 将规定属性这是为相关的只,并优先加上important

 

        

b、元素大小  

 偏移量

offsetHeight:元素在垂直方向上占用的空间大小,以像素计算。

offsetWidth:

offsetLeft: : 元素的左边框至父内边框之间的想素,

offsetTop

offsetParent

getElementLeft()和getElementTop()返回与offsetLeft offsetTop()相同。

客户区大小 : 指的是元素内容及其内边距的大小。

clientWidth 元素宽度加内边距的大小

clientHeght 元素内容区高度加上上下边距的高度

 

    滚动大小:包含滚动内容的元素大小。

    scrollHeight : 在没有滚动条的情况下,元素内容的总高度。

    scollWidth : 在没有滚动条的情况下,元素内容的总宽度。

    scrollLeft  : 被隐藏在内容区左侧像素数。设置此属性可以改变滚动条的位置。

    scrollTop : 被隐藏在内容区上方像素数。设置此属性可以改变滚动条位置,

 

 

scrollHeight和scrollWidth主要用于确定元素内容的实际大小。

带有垂直滚动条的页面总高度就是document.body.scollHeight。

对于不包含滚动条的页面而言,scollHeight和scollWidth与clientWidth和clientHeight之间的关系并不十分清晰。

        

   元素大小

    getBoundingClentRect() 返回一个矩形对象,包含left 、top、right和bottom.这些属性给出元素在页面中相对于视口的位置。但各浏览器的实现各有不同。

 

 

 

 

 

 

© 著作权归作者所有

前端小虾
粉丝 1
博文 44
码字总数 21084
作品 0
东城
私信 提问
javascript中DOM0,DOM2,DOM3级事件模型解析

DOM 即 文档对象模型。 文档对象模型是一种与编程语言及平台无关的API(Application programming Interface)借助于它程序能够动态地访问和修改文档内容、结构或显示样式。 DOM3级顾名思义有三...

木头先生
2017/11/15
0
0
温故js系列(10)-事件event

前端学习:教程&开发模块化/规范化/工程化/优化&工具/调试&值得关注的博客/Git&面试-前端资源汇总 欢迎提issues斧正:Event JavaScript-事件event JavaScript中,事件一般是指浏览器和用户操...

xzavier
2018/08/27
0
0
重学js之JavaScript简介

注意: 本文章为 《重学js之JavaScript高级程序设计》系列第一章。 关于《重学js之JavaScript高级程序设计》是重新回顾js基础的学习。 JavaScript是一种专门为网页交互而设计的脚本语言,主要...

故事胶片
05/27
0
0
理解:javascript中DOM0,DOM2,DOM3级事件模型

理解:javascript中DOM0,DOM2,DOM3级事件模型 javascript中的事件 javascript程序使用的是事件驱动的设计模式,为一个元素添加事件监听函数,当这个元素的相应事件被触发那么其添加的事件监听...

mamadu
2017/10/13
0
0
Dom2,Dom3在实际开发中使用到的多吗?

感觉Dom2,Dom3比较繁琐,而且新增的一些功能感觉没什么实际用处。例如操作文档的doctype,xml命名空间等等。。实际开发中这些很少会用吧

lingengbin
2013/11/13
250
0

没有更多内容

加载失败,请刷新页面

加载更多

JS其他类型值转化为Boolean类型规则

本文转载于:专业的前端网站➤JS其他类型值转化为Boolean类型规则 由于最近在笔试的时候,发现好多关于其他类型转化为Boolean类型的题目,因此总结一下! 一、String类型转化为Boolean 1.转化...

前端老手
36分钟前
4
0
EurekaClient自动装配及启动流程解析

在上篇文章中,我们简单介绍了EurekaServer自动装配及启动流程解析,本篇文章则继续研究EurekaClient的相关代码 老规矩,先看spring.factories文件,其中引入了一个配置类EurekaDiscoveryClie...

Java学习录
42分钟前
8
0
析构函数是否必须为虚函数?为何?

p517 在C++中,基类指针可以指向一个派生类的对象。如果基类的析构函数不是虚函数,当需要delete这个指向派生类的基类指针时,就只会调用基类的析构函数,而派生类的析构函数无法被调用。容易...

天王盖地虎626
43分钟前
5
0
【TencentOS tiny】深度源码分析(7)——事件

引言 大家在裸机编程中很可能经常用到flag这种变量,用来标志一下某个事件的发生,然后在循环中判断这些标志是否发生,如果是等待多个事件的话,还可能会if((xxx_flag)&&(xxx_flag))这样子做...

杰杰1号
46分钟前
9
0
聊聊nacos client的ServerHttpAgent

序 本文主要研究一下nacos client的ServerHttpAgent HttpAgent nacos-1.1.3/client/src/main/java/com/alibaba/nacos/client/config/http/HttpAgent.java public interface HttpAgent { ......

go4it
52分钟前
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部