Jquery学習ノート(DOM操作)

2256 ワード
jquery
DOM操作
  • DOM Core
  • HTML-DOM
  • CSS-DOM

    • 要素の追加
    append()               
appendTo()
prepend()               
prependTo()
after()               
insterAfter()
before()               
insertBefore

    削除ノードremove(),detach(),empty()
    1. remove()                    
                      ，              
    var $li = $('ul li:eq(1)').remove();
    $li.appendTo("ul");
    remove()                  

2. detach()              JQuery     ， remove()            、          

3. empty()          ，      ，

    ノードのコピー
    clone()
Clone(true)     ，

    ノードの置換
    replaceWith()
replaceAll()

    ラップノード
    wrap()
wrapAll()
warpInner()

    属性アクション
    attr()          ，removeAttr()      

prop() removeProp()，

    スタイルアクション
    1.     、    
    var p_class = $('p').attr('class');  //  
       class
    $('p').attr('class', 'height');   // 
        class hegith

2.     
    addClass()

3.     
    removeClass()

4.     
    toggle()
    toggleClass()

5.           
    hasClass()

    HTML、テキスト、値の設定と取得
    1. html()              HTML  

2. text()                 

3. val()            
        focus(),blur()  ，          ，    
    $('#address').focus(function() {
        var txt_value = $(this).val();
        if (txt_value == "       ") {
            $(this).val('');
        }
    });

    ループノード
    1. children()                  
      .length，for        

2. next()                  

3. prev()                  

4. siblings()

    parent()parents()とclosest()の違い
    **parent()**                     
    $('item-1').parent().css('background-color', 'red');                 ，        

**parents()**                   
    $('item-1').parents('ul').css('background-color', 'red');
     parent()    ，                  ，      ，         

**closest()**        ，         ，
    鋭いjqueryノート
    先端開発学習ノート4