主要是遍历、创建、添加、删除元素操作。
遍历元素
jQuery 隐式迭代是对同一类元素做了同样的操作。
语法1:
$("div").each(function(index, domEle) { xxx; })
- each()方法遍历匹配到的每一个元素。主要用 DOM 处理。each 每一个
- 里面的回调函数有2个参数:index 是每个元素的索引号;demEle 是每个 DOM 元素对象,不是jQuery 对象
- 所以想要使用 jQuery 方法,需要给这个 DOM 元素转换为 jQuery 对象 $(domEle)
语法2:
$.each(object,function(index, element) { xxx; })
- $.each()方法可用于遍历任何对象。主要用于数据处理,比如数组,对象
- 里面有2个参数:index 是每个元素的索引号;element 是遍历内容
创建元素
语法:
$("<li></li>");
动态创建了一个<li>
添加元素
内部添加
element.append("内容") //添加到元素内部的最后面
element.prepend("内容") //添加到元素内部的最前面
内部添加元素,生成之后,他们是父子关系。
外部添加
element.after("内容") //把内容放入目标元素后面
element.before("内容") //把内容放入目标元素前面
外部添加元素,生成之后,他们是兄弟关系。
删除元素
element.remove() //删除元素本身
element.empty() //删除元素集合中所有的子节点
element.html("") //清空匹配的元素内容
GitHub Issues