700字范文 > css中选择器有超文本 dom操作 – CSS – 前端 css底纹

css中选择器有超文本 dom操作 – CSS – 前端 css底纹

时间：2020-11-08 02:57:28

一、DOM树

DOM树有两种，分别为节点树和元素树。

节点树：把文档中所有的内容都看成树上的节点；

元素树：仅把文档中的所有标签看成树上的节点。

二、DOM常用操作

2.1 查找节点

document.getElementById(id属性值);

返回拥有指定id的第一个对象的引用

document/element.getElementsByClassName(class属性值);

返回拥有指定class的对象集合

document/element.getElementsByTagName(标签名);

返回拥有指定标签名的对象集合

document.getElementsByName( ame属性值);

返回拥有指定名称的对象结合

document/element.querySelector(CSS选择器);

仅返回第一个匹配的元素

document/element.querySelectorAll(CSS选择器);

返回所有匹配的元素

document.documentElement

获取页面中的HTML标签

document.body

获取页面中的BODY标签

document.all[\]

获取页面中的所有元素节点的对象集合型

2.2 新建节点

document.createElement(元素名);

创建新的元素节点

document.createAttribute(属性名);

创建新的属性节点

document.createTextNode(文本内容);

创建新的文本节点

document.createComment(注释节点);

创建新的注释节点

document.createDocumentFragment( );

创建文档片段节点

2.3 添加新节点

parent.appendChild( element/txt/comment/fragment );

向父节点的最后一个子节点后追加新节点

parent.insertBefore( newChild, existingChild );

向父节点的某个特定子节点之前插入新节点

element.setAttributeNode( attributeName );

给元素增加属性节点

element.setAttribute( attributeName, attributeValue );

给元素增加指定属性，并设定属性值

@ 用什么表示子代选择器？

CSS3中的关系选择器主要包括子代选择器和兄弟选择器，其中子代选择器由符号连接，兄弟选择器由符号“+”和“~”连接，具体如下所示。

（1）关系选择器

例如： h1>strong

说明：表示选择嵌套在h1标记的子标记strong。

（2）临近兄弟选择器

例如： h2+p

说明：表示选择h2标记后紧邻的第一个兄弟标记p。

（3）普通兄弟选择器

例如：p~h2

说明：表示选择p标记所有的h2兄弟标记

@ css选择器选取节点的是？

CSS是一种用于屏幕上渲染html，xml等一种语言，CSS主要是在相应的元素中应用样式，来渲染相对应用的元素，那么这样大家选择相应的元素就很重要了，如何选择对应的元素，此时就需要大家所说的选择器。在 CSS 中，选择器是一种模式，用于选择需要添加样式的元素。选择器主要是用来确定html的树形结构中的DOM元素节点。