jquery(2)——操纵DOM

创建新元素

    var e = $('<div class="dcell"><img src="image/ziluolan.jpg"></div>');

克隆已有元素

 var e = $('div.dcell').clone();

添加子元素或后代元素

 $("#row1").append(e);//将子元素e插入到所有jQuery元素的末尾，成为最后一个子元素
    $("#row2").prepend(e);//将子元素e插入到所有jQuery元素之前，成为第一个子元素
    $("#row1").appendTo(jQuery / HTMLElement);//插入到指定元素末尾
    $("#row1").prependTo(jQuery / HTMLElement);//插入到指定元素开头
    $("#row1").append(function () {
    });//将函数返回的对象插入内含元素之后或之前
    $("#row1").prepend(function () {
    });

封装元素

 var e = $("<div/>").css("border", "thick solid red");
    $('div.dcell').wrap(e)//使用e封装对象内的每个元素
    $('div.dcell').wrapAll(e)//将jQuery对象中的所有元素组合到一起，再用e封装
    $('div.dcell').wrapInner(e)//封装jQuery对象内元素的内容
    $('div.dcell').wrap(function () {
    })//使用回调函数

插入兄弟元素

 $('div.dcell').after(e)  //将e作为下一个兄弟元素添加到div.dcell中的每一个元素之后
    $('div.dcell').before(e) //将e作为下一个兄弟元素添加到div.dcell中的每一个元素之前
    $('div.dcell').insertAfter(e)  //将div.dcell作为下一个兄弟元素添加到e中的每一个元素之后
    $('div.dcell').insertBefore(e)  //将div.dcell作为下一个兄弟元素添加到e中的每一个元素之前
    after(function () {
    })//使用回调函数

替换元素

    $('div.dcell').replaceWith(e)//用e替换掉 div.dcell
    $('div.dcell').replaceAll(e)//用div.dcell替换掉 e
    $('div.dcell').replaceWith(function () {
    })//使用回调函数替换

删除元素

 deatch()//从dom中删除元素，并保留关联在元素上的数据
    remove()//从dom中删除元素，不保留关联在元素上的数据
    e.empty()//删除e的所有子元素
    e.unwrap()//删除e内每个元素的父元素