JavaScript基础知识(三)

样式修改

元素.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声明带来的变量作用域的一系列问题

相关推荐
明月看潮生8 分钟前
青少年编程与数学 02-003 Go语言网络编程 15课题、Go语言URL编程
开发语言·网络·青少年编程·golang·编程与数学
南宫理的日知录18 分钟前
99、Python并发编程:多线程的问题、临界资源以及同步机制
开发语言·python·学习·编程学习
逊嘘35 分钟前
【Java语言】抽象类与接口
java·开发语言·jvm
Half-up38 分钟前
C语言心型代码解析
c语言·开发语言
别拿曾经看以后~1 小时前
【el-form】记一例好用的el-input输入框回车调接口和el-button按钮防重点击
javascript·vue.js·elementui
川石课堂软件测试1 小时前
性能测试|docker容器下搭建JMeter+Grafana+Influxdb监控可视化平台
运维·javascript·深度学习·jmeter·docker·容器·grafana
Source.Liu1 小时前
【用Rust写CAD】第二章 第四节 函数
开发语言·rust
monkey_meng1 小时前
【Rust中的迭代器】
开发语言·后端·rust
余衫马1 小时前
Rust-Trait 特征编程
开发语言·后端·rust
JerryXZR1 小时前
前端开发中ES6的技术细节二
前端·javascript·es6