jquery隐藏html中的父级元素,jQuery父子元素parent() parents() closest() children() find()用法与区别...

这些都是在DOM中使用频率比较高的方法，这里记录一下备忘。

先上定义：

parent() 获得当前匹配元素集合中每个元素的父元素。

parents() 获得当前匹配元素集合中每个元素的祖先元素。

closest() 方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上。

parentsUntil() 获得当前匹配元素集合中每个元素的祖先元素，直到遇到匹配选择器的元素为止。

children() 获得匹配元素集合中每个元素的所有子元素。

find() 获得当前匹配元素集合中每个元素的后代，由选择器进行筛选。

再说人话：

parent() 只找爸爸，不找爷爷，返回一个元素或空。

parents() 爸爸爷爷曾祖父只要匹配的就一窝端，有可能返回多个元素。

closest() 从DOM树向上找匹配的第一个，爸爸匹配就返回爸爸，爸爸不匹配爷爷匹配就返回爷爷，如此类推，返回一个元素或空。

children() 只找儿子，不找孙子，与parent相同只是查找方向相反。

find() 儿子孙子曾孙只要匹配的就一窝端，与parents相同但方向相反。

PS：对于parents()和find()这类返回集合的，如果使用类似console.log(集合.html())方法，会返回第一个元素的结果。经测试，find()是按DOM从上往下顺序查找，而不是按树状一层一层往下查找，数据结构上有专门的名称，叫什么查找法但我忘了，即是说会从第一个元素一直找到底，再退回去继续往下找，只要是放在靠前面的元素，哪怕放得非常深层，都会优于放在后面的元素先被查找到。

PS2：closest()是从当前元素开始往上查找，parents()则是从父元素开始，即是说连续用closest()是不能实现逐级往上的。