| JQ | JS | |
|---|---|---|
| 获取 | $(#h1)$(.h1)$(‘.classTag1’)[0].tagName; | document.getElementById()document.getElementsByClassName()document.getElementsByTagName() |
| 创建 | var h1 = $(‘‘) | var h1 = document.createElement(‘‘) |
| 添加 | before() insertBefore() 插入前面 append() appendTo() 插入尾部 prepend() prependTo() 插入父元素的最前面 after() insertAfter() 插入后面 |
document.insertBefore(h1) 头部添加document.appendChild(h1) 尾部添加 |
| 移除 | remove() html() empty() |
document.removeChild(h1) 删除子元素h1 .remove() 删除本身 |
| 复制 | clone() | var h = h1.cloneNode() |
| 查找 | find() 查找子级 children()查找子级们 siblings()查找同级 contents()查找文本节点 prev()查找上一级节点 prevAll()查找上一级节点们 next()查找下一级节点 nextAll()查找下一级节点们 first()第一个节点 last()最后一个节点 伪类查找 $(‘xxx’):first 查找第一个节点 $(‘xxx’):last 查找最后一个节点 $(‘xxx’):eq(‘下标’)查找指定节点$(‘xxx’):not(‘.xxx’)查找不含有同级节点 $(‘xxx’):has(‘.xxx’)查找含有该节点的元素$(‘xxx’):gt(‘下标’)查找大于指定下标节点 $(‘xxx’):lt(‘下标’)查找小于指定下标节点$(‘xxx’):odd查找奇数倍节点 $(‘xxx’):even 查找偶数倍节点 |
childNodes 元素节点和文本节点 children 元素节点 firstChild 获取第一个节点（文本节点也算） firstElementChild 文本节点不算，推荐 lastChild lastElementChild获取最后一个节点 previousSibling previousElementChild 获取上一个节点 nextSibling nextElementSibling 获取下一个节点siblings 获取同级节点 |