jQuery节点操作

1.元素节点操作

（1）创建节点

（2）插入节点
append（）和appendTo（）：在现存元素的内部，从后面插入元素

prepend（）和prependTo（）：在现存元素内部，从前面插入元素

after（）和insertAfter()：在现存元素外部，从后面插入元素

before（）和insertBefore（）：在现存元素的外部，从前面插入元素

$(function(){
/通过HTML的字符串的方式添加节点性能最高，只写a页面就只有a/
/$('.div1').html($('.div1').html()+'123')/

    /*新建一个带有属性的a标签，并在后面添加*/
    $a = $('123');
    /*父元素内的后面放入子元素*/
    /*$('.div1').append($a);*/
    $a.appendTo($('.div1'));

    /*新建立一个空标签*/
    $a001 = $('');
    $('.div1').append($a001);

    /*父元素的前面放入子元素*/
    $p = $('
123
');
    $('.div1').prepend($p);

    /*在元素外部的后面插入，before前面*/
    $d = $('
466
');
    $('.div1').after($d);
})

（3）删除节点

$(function(){
/把P标签放到h2前面/
$('#no2').insertBefore($('#title'));
/把span标签放进p标签里面/
$('#no3').appendTo($('#no2'));
/删除标签/
$('#title').remove();
})

例子：TO do list

    
To Do List
    
    
    

        

            学习HTML
            
            ↑
            ↓
            删除
        
        

            学习CSS
            ↑
            ↓
            删除
        
        

            学习JavaScript
            ↑
            ↓
            删除