03-上手

节点的选择

first() ★★★
last() ★★★
slice() ★
children() 针对子节点,不针对孙节点 ★★★
find() :查找范围更加广泛 ★★★★★

  • children和find区别

节点的选择

parent() ★★★
parents() ★
closest() ★★★★★
精准的查找能力,实战开发之王
找的是最近的唯一一个元素(包括自身)
例子 : 点击查找指定节点

添加节点

insertBefore() before() ★★★★★
insertAfter() after() ★★★★★
appendTo() append() ★★★★★
prependTo() prepend() ★★★★★
两种写法的区别

  • append() : 把元素添加到指定的节点的里面的最后
  • prepend() : 把元素添加到指定的节点的里面的最前面
  • before() : 把元素添加到指定的节点的前面
  • after() : 把元素添加到指定的节点的后面

JQ中的索引

index() ★★★★★

  • 第一种用法,兄弟中的排行
  • 第二种用法,筛选后的排行
  • 善于利用索引做实际开发
    • 例子 : 选项卡

遍历

each() ★★★★★
回调函数的两个参数 (value返回的是原生js对象)
this指向 == value
return false;

包装

//wrap() : 包装

//wrapAll() : 整体包装

//wrapInner() : 内部包装

//unwrap() : 删除包装( 相当于删除父节点 , body是不能被删 )

1
2
3
4
5
//$('span').wrap('<div>');

//$('span').wrapAll('<div>');

//$('span').wrapInner('<div>');

get()

get() ★★★★★
与eq的区别
为什么要转,比如:
获取内容的高度
元素之间的比较

1
$nowLi.get(0) == $nowLi.parent().children().eq(0).get(0)