样式修改
元素.style是对象的一种格式,用于通过设置元素的相关行内样式来设置css,也可以选择相关关联的样式来修改元素相关的样式.
要注意的是,选择相关的样式的时候,样式名是采用小驼峰写法而非是全部小写的方式
类名
添加类名: 元素.classList.add("classname")
删除指定类名: 元素.classList.remove("classname")
特殊方式: 元素.classList.toggle("name") 存在则删除,不存在则创建
id名
获取相关元素的id名称: 元素.id
给予元素相关id名称: 元素.id = "名称"
节点名称
每一个标签可以被称为元素节点,可以通过相关内置方法来对标签以及其父子节点进行获取
ele.childNodes 获取ele元素的所有子节点同时返回一个类数组
node.nodeType
获取对应节点的数字描述
相关数字描述如下:
-
文本节点 3 注意: 空格也是文本节点
-
注释节点 8
-
元素节点 1
-
文档片段节点 11
node.nodeName
获取节点名称
node.nodeValue
获取节点的文本内容
其他常用api(即相关方法)
ele.children 获取ele的所有子元素节点
ele.parentNode 获取ele的父级元素节点
ele.offsetParent 获取ele的定位父级元素节点
要注意 position:absolute的特殊性
document.createElement("ele") 在文档中创建ele节点
ele.appendChild("newele") 在ele中末尾添加newele节点
ele.insertBefore(newele, referele) 在参考节点referele之前创建一个newele节点
this
在JavaScript中存在this关键字,其并不是一成不变的,而是会随着执行环境的改变而发生变化
-在每一次方法中,this表示全局对象
-如果单独使用,this表示全局对象
-在函数中,this表示全局对象
-在函数中,this并未定义
-在事件中,this表示接受事件的元素
-类似于call和apply方法,可以将this引用到任何对象
this还可以弥补var声明带来的变量作用域的一系列问题