DOM
一、获取标签
罕用:
document.querySelector()
document.querySelectorAll()
依据节点获取:
父.children
父.firstElementChild
父.lastElementChild
标签.previousElementSubling
标签.nextElementSibling
子.parentElement
不罕用:
document.getElementById()
document.getElementsByTagName()
document.getElementsByClassName()
document.getElementsByName()
二、操作标签
创立标签:
document.createElement()
插入标签:
父.appendChild(子)
父.insertBefore(新, 旧)
替换标签:
父.replaceChild(新, 旧)
删除标签:
父.removeChild(子)
复制标签:
标签.cloneNode(true)
标签属性:
标签.getAttribute(属性名)
标签.setAttribute(属性名, 属性值)
标签.removeAttribute(属性名)
类名操作:
标签.className // 能够获取 / 能够赋值
标签.classList
classList 的办法:
add()
remove()
has()
toggle()
内容操作:
标签.innerText
标签.innerHTML
表单标签.value
款式操作:
获取款式:
getComputedStyle(标签) // 获取到所有款式组成的对象
设置款式:
标签.style.css 键 = css 的值
获取标签名:
标签.tagName
获取标签大小:
蕴含边框的:
标签.offsetWidth
标签.offsetHeight
不蕴含边框的:
标签.clientWidth
标签.clientHeight
获取标签地位:
标签.offsetLeft
标签.offsetTop
获取标签边框厚度:
标签.clientLeft
标签.clientTop