HTML DOM 是将一个html文档当做树结构,树有根枝叶,html文档也有根枝叶,这些根枝叶,都可以叫做一个个的节点,即DOM节点;
要对html进行操作,也就是对html 的DOM节点进行操作,要操作,首先就是要找到进行操作的节点,其中一种方法就是用Jquery的选择器:基本选择器,层次选择器,过滤选择器,表单选择器;
比较常用的还有Jquery节点的遍历,主要有的方法如下:
1.children(); 查找匹配元素节点的子元素集合(只考虑儿子,不考虑孙子);
2.next(); 查找匹配元素节点的紧邻的下一个兄弟节点;
3.prev(); 查找匹配元素节点的紧邻的上一个兄弟节点;
4.siblings(); 查找匹配元素节点的紧邻的前后所有兄弟节点;
5.closest(); 取得最近的匹配元素,从自己开始,向上查找,直到找到匹配元素;
6.parent(); 取得一个匹配的爸爸节点(只有一个爸爸);
7.parents(); 取得匹配的一层层向上的祖先(爸爸,爷爷,太爷爷,祖爷爷………..html;)
8.find(); 必须要有参数,取得匹配的所有后代(儿子,孙子,重孙…)
9.filter(); 在选择器的基础上再进行过滤;
10.nextAll();取得匹配元素紧邻的后续所有兄弟节点(找到自己的所有弟弟)
11.prevAll();跟上一个函数相似,该函数是取得匹配元素紧邻的之前所有兄弟节点(找到自己的所有的哥哥)
区别:
1.children()和find()
children()只取得它的所有孩子节点(一层),find取得所有的后代节点(往下多层);
children()函数的参数可选,find()函数必须要有选择器参数;
2.parent()、parents()和closest()
parent()逐级向上遍历节点,返回一个爸爸(不包括自身);
parents()逐级向上遍历节点,返回多个,包括爸爸,爷爷,太爷爷,祖爷爷……….html,不包括自身;
closest()从自身找起,逐级向上遍历节点,直到找到一个匹配的元素节点,返回;
备注:
1.第一次写技术类的东西,有不完善的或者不确切的地方还请大神指正;
2.本文原创,转发请注明出处,谢谢