【jQuery】經常使用點

包裝javascript

  • wrap() 包裝css

  • wrapAll() 總體包裝java

  • wrapInner() 內部包裝數組

  • unwrap() 刪除包裝(不包括body)函數

$(function(){
    $('span').wrap('<div>');
})

主動觸發trigger工具

$(function(){
    $('span').on('click',function(){
        alert(123);
    })
    $('span').trigger('click');
    //主動觸發點擊事件
})

jQuery中的事件委託delegatethis

//通常寫法 直接給li加事件
$(function(){
    $('li').on('click',function(){
        $(this).style.background = 'red';
    })
})

//事件委託
$(function(){
    $('ul').delegate('li','click',function(){
        $(this).css('background', 'red').siblings().css('background', '#fff');
    })
})
//阻止事件委託
$(function(){
    $('ul').delegate('li','click',function(){
        $(this).css('background', 'red').siblings().css('background', '#fff');
        $('ul').undelegate();
    })
})

event對象屬性spa

  • event.data 事件中的數據code

  • event.target 事件源對象

  • event.type 事件類型

<script type="text/javascript">
    $("#div1").on('click', {name:'hello'}, function(event) {
        alert(event.data.name);
    });
</script>

jQuery工具方法 $.xxx();

  • $.type() 判斷類型

  • $.trim(str) 去空格

  • $.inArray('a',arr) 返回a所在數組中的位置,沒有則返回-1 相似indexOf

  • $.proxy() 改變this的指向

  • $.noConflict() 防止衝突

  • $.type() 判斷類型

<script type="text/javascript">
    //$.type()    判斷類型
    var a = [];
    //alert( typeof a );//js 返回類型爲object
    alert( $.type(a) );// 返回類型爲array 更具體
    
    //$.trim(str)    去空格
    var str = "   hello    ";
    //alert( '('+ str+')' );
    alert( '('+ $.trim(str) +')' );
    
    //$.inArray('a',arr)
    var arr = ['a','b','c',''d];
    alert( $.inArray('a',arr) ); //返回0 若是沒有返回-1
    
    //$.proxy()    改變this的指向
    function show(a,b){
        alert(this);
    }
    show(); //this指向window
    $.proxy(show,document,1,2)(); //show函數的this,指向了document, 1,2是參數 ()是執行show
    
    //$.noConflict()    防止衝突
    var ht = $.noConflict();
    ht(function(){
        alert(123);
    })
    
    //$.parseJSON 把字符串解析成JSON對象
    var str = '{"name":"hello"}';
    alert( $.parseJSON(str).name );
    
</script>
相關文章
相關標籤/搜索