节点操作-增*删 查 获取日期对象

168 阅读1分钟
  • 节点操作
  • 本质上针对标签本身的增删查 总结: 有明确的亲戚关系的时候, 使用查语法更加方便一些 查

Snipaste_2022-03-27_16-57-14.png

返回的都是dom对象
		`查找父级`: 子元素.parentNode
			查找最近的父级元素,返回是dom元素
		`查找子`集: 父元素.children
			伪数组
				遍历,不能使用forEach
		`兄弟`
			nextElementSibling
				下一个兄弟元素
			previousElementSibling
				上一个兄弟元素
  • 节点-增
  • 创建新节点
`let result = document.createElement`(标签名称)
		创建元素之后,还需要对元素设置内容和样式
			内容设置:innerText   innerHTML
			属性设置: 元素.属性
  • 追加节点 parent.appendChild(child)
将child的元素添加到parent元素里面去(最后面)
			append:追加,都是在最后面追加
	parent.insertBofore(child, refChild)
		将child元素添加到refChild的前面去
			ref:相对引用参照
		如果refChild元素获取不到, 会默认以appendChild形式添加
		一定要传递第二个参数,否则报错
	追加的节点可以是新创建的 也可以是页面上已经存在 (移动)
  • 克隆节点
模板元素.cloneNode(布尔值)
			false: 浅拷贝
				只拷贝元素结构
			true: 深拷贝
				拷贝元素结构及内容
			用于需要创建一个复杂的标签
				前提: 页面上有一个模板节点
  • 1. 获取日期对象
`new Date()`
  • 2. 获取日期对象的每一个部分
`getFullYear()
	getMonth() + 1
	getDate()
	getHours()
	getMinutes()
	getSeconds()`
  • 删除节点
parent.removeChild(child):通过父元素删除直接子元素
	element.remove():删除元素本身