PlainJs

使用 CSS 选择器

querySelectorAll - 类似于jQuery提供的CSS选择器方法

jQuery: $(selector)、$(selector, context)

使用类名选择元素

getElementsByClassName - 使用 className 快速选择 DOM 元素，不支持 IE8 以及低版本浏览器

jQuery: $('.foo')

使用标签名选择元素

getElementsByTagName - 使用 DOM 标签快速选择 DOM 元素。比如： "div"、"a"、"span"等等

jQuery: $('div')

使用 id 选择元素

getElementById - 使用 id 选择dom元素

jQuery: $('#foo')

元素匹配

检测当前元素是否和 css 选择器匹配

jQuery: $.is()

获取父元素节点

获取当前元素的父元素节点

jQuery: $.parent()、$.parents()

获取同级元素

获取当前 DOM 元素同级元素

jQuery: $.siblings()、$.next()、$.nextAll()、$.prev()、$.prevAll()

获取选择器最接近的元素

返回被选元素的第一个祖先元素，祖先是父、祖父、曾祖父，依此类推

jQuery: $.closest()

获取一个元素的所有直接子元素

返回被选元素的所有直接子元素

jQuery: $.children()

创建一个 DOM 元素

创建一个新元素并将其附加到DOM树

jQuery: $(string)

替换一个 DOM 元素

从 DOM 树中删除一个元素，然后在其位置插入一个新元素

jQuery: $.replaceAll()、$.replaceWith()

移除元素的包裹元素

从 DOM 中删除元素的父级，并用当前元素替换父级元素

jQuery: $.unwrap()

清空元素内容

从 DOM 中删除元素的所有子节点

jQuery: $.empty()

移除 DOM 元素

从 DOM 数中移除一个元素

jQuery: $.remove()、$.detach()

在元素之前或者之后插入新的元素

在给定的 DOM 元素之前或者之后插入新的元素

jQuery: $.after()、$.before()、$.insertAfter()、$.insertBefore

获取元素的文本内容

获取元素的组合文本内容（包括其后代），或设置元素的文本内容。

jQuery: $.text()

获取或者设置元素的HTML内容

读取或者设置一个元素的 HTML 内容

jQuery: $.html()

在元素的结尾或者开头插入指定内容

在一个元素内容的结尾或开头插入一个新元素或HTML结构

jQuery: $.append()、$.appendTo()、$.prepend()、$.prependTo()

在一个元素的外部包裹一个 DOM 元素

使用指定的 DOM 元素来包裹每个被选元素

jQuery: $.wrap()、$.wrapAll()

克隆一个元素

深拷贝一个 DOM 树上的元素

jQuery: $.clone()

JavaScript常用函数片段

DOM选择器