jQuery DOM 遍历

children()

//查找合集里面的子元素
$('.violet').children(':last');

find()

$('.violet').find($('span')); //查找后代元素里的所有 span 元素
$('span', '.violet'); //此写法和上面的方式等价

parent()

//查找合集里面的父元素
$('.violet').parent(':last'); //查找所有 .violet 的父元素里的最后一个

parents()

//查找合集里的祖辈元素,返回的是包含零个或一个或多个元素的 juery 对象
$('.violet').parents('.violet-gem'); //遍历要根目录，查找所有的 .violet-gem

closest()

//和 parents() 方法类似，但遍历的起始位置是从父元素开始，返回零个或一个 jQuery 对象
$('div.violet').closest($('.violet-gem')); //只查找到一个 .violet-gem ，就停止遍历

next()

//快速查找指定元素集合中每一个元素紧邻的后面同辈元素的元素集合
$('.violet').next(); //查找 .violet 的第一个兄弟元素

prev()

//查找指定元素集合中每一个元素紧邻的前面同辈元素的元素集合
$('.violet').prev(':last'); //查找所有 .violet 上一个兄弟元素合集里的最后一个

siblings()

//查找指定元素集合中每一个元素的同辈元素，不包括自己
$('.violet').siblings();

add()

// jQuery 是一个合集对象，通过 $() 方法找到指定的元素合集后可以进行一系列的操作。
// $() 之后就意味着这个合集对象已经是确定的，如果后期需要再往这个合集中添加一新的元素要如何处理？
// jQuery 为此提供 add 方法，用来创建一个新的 jQuery 对象 ，元素添加到匹配的元素集合中
$('div').add('<p>Violet-gem</p>').appendTo('.violet'); //添加完 p ,这后要把它指定到 .violet 处才能显示出来
$('li').add('p');

each()

//就是一个 for 循环的迭代器，它会迭代 jQuery 对象合集中的每一个 DOM 元素。每次回调函数执行时，会传递当前循环次数作为参数（从0开始计数）
$("li").each(function (index, element) {
    $(this).css('color', 'violet');
});

$("a").each(function (index, element) {
    if(index % 2){
        $(this).css('color', 'MediumPurple');
    }
});