js一些基础

简介: js一些基础

4.2.3、文档节点

文档节点(Document)代表的是整个HTML文 档,网页中的所有节点都是它的子节点。

document对象作为window对象的属性存在的,我们不用获取可以直接使用。

通过该对象我们可以在整个文档访问内查找节点对象,并可以通过该对象创建各种节点对象。

4.2.4、元素节点

HTML中的各种标签都是元素节点(Element),这也是我们最常用的一个节点。

浏览器会将页面中所有的标签都转换为一个元素节点, 我们可以通过document的方法来获取元素节点。

例如:document.getElementById(),根据id属性值获取一个元素节点对象。

4.2.5、属性节点

属性节点(Attribute)表示的是标签中的一个一个的属 性,这里要注意的是属性节点并非是元素节点的子节点,而是元素节点的一部分。可以通过元素节点来获取指定的属性节点。

例如:元素节点.getAttributeNode("属性名"),根据元素节点的属性名获取一个属性节点对象。

注意:我们一般不使用属性节点。

4.2.6、文本节点

文本节点(Text)表示的是HTML标签以外的文本内容,任意非HTML的文本都是文本节点,它包括可以字面解释的纯文本内容。文本节点一般是作为元素节点的子节点存在的。获取文本节点时,一般先要获取元素节点,在通过元素节点获取文本节点。

例如:元素节点.firstChild;,获取元素节点的第一个子节点,一般为文本节点。

4.3、DOM文档操作

文档对象代表您的网页,,如果您希望访问 HTML 页面中的任何元素,那么您总是从访问 document 对象开始。

下面是一些如何使用 document 对象来访问和操作 HTML 的实例。

 

拓展知识1:

通过style属性设置和读取的都是内联样式,无法读取样式表中的样式或者说正在应用的样式,如果想要读取当前正在应用的样式属性我们可以使用元素.currentStyle.样式名来获取元素的当前显示的样式,它可以用来读取当前元素正在显示的样式,如果当前元素没有设置该样式,则获取它的默认值,但是currentStyle只有IE浏览器支持,其它的浏览器都不支持,在其它浏览器中可以使用getComputedStyle()这个方法来获取元素当前的样式,这个方法是window的方法,可以直接使用,但是需要两个参数:

第一个参数:要获取样式的元素

第二个参数:可以传递一个伪元素,一般都传null

该方法会返回一个对象,对象中封装了当前元素对应的样式,可以通过 对象.样式名 来读取样式,如果获取的样式没有设置,则会获取到真实的值,而不是默认值,比如:没有设置width,它不会获取到auto,而是一个长度,但是该方法不支持IE8及以下的浏览器。通过currentStyle和getComputedStyle()读取到的样式都是只读的,不能修改,如果要修改必须通过style属性,因此,我们可以写一个适配各个浏览器的读取元素样式的方法。

 

 

目录
相关文章
|
8月前
|
JavaScript
【JS篇】JS基础要件
【JS篇】JS基础要件
46 0
|
8月前
|
存储 JavaScript 前端开发
JS——基础(一)
JS——基础(一)
|
8月前
|
XML JavaScript 前端开发
JS的简介和作用还有为什么会产生JS?
JS的简介和作用还有为什么会产生JS?
66 2
|
9月前
|
缓存 JavaScript 前端开发
Js的基础
Js的基础
32 0
|
存储 JavaScript 前端开发
js基础学习
JavaScript 是一门跨平台、面向对象的脚本语言,它能使网页可交互(例如拥有复杂的动画,可点击的按钮,通俗的菜单等)。另外还有高级的服务端 Javascript 版本,例如 Node.js,它可以让你在网页上添加更多功能,不仅仅是下载文件(例如在多台电脑之间的协同合作)。在宿主环境(例如 web 浏览器)中,JavaScript 能够通过其所连接的环境提供的编程接口进行控制。
|
缓存 JavaScript
JS 开发中遇到的坑
JS 开发中遇到的坑
|
JavaScript
JS基础(4)
JS基础(4)
81 0
|
存储 JavaScript 前端开发
JS基础(2)
JS基础(2)
94 0
|
JavaScript 前端开发
JS基础(3)
JS基础(3)
68 0
|
存储 JSON JavaScript
JS基础-方法
方法就是把函数放在对象的里面,对象只有两个东西:属性和方法
95 0