3、檢查圖像是否加載

有時為了繼續(xù)腳本，你可能需要檢查圖像是否全部加載完畢：

$('img').load(function () {

console.log('image load successful');

});

你也可以用ID或類替換<img>標簽來檢查某個特定的圖像是否被加載。

4、自動修復破壞的圖像

逐個替換已經(jīng)破壞的圖像鏈接是非常痛苦的。不過，下面這段簡單的代碼可以幫助你：

$('img').on('error', function () {

if(!$(this).hasClass('broken-image')) {

$(this).prop('src', 'img/broken.png').addClass('broken-image');

}

});

即使沒有任何斷掉的鏈接，加上這一段代碼也不會讓你有任何損失。

5、懸停切換類

假設你希望當用戶將鼠標懸停在可點擊的元素上時，它會改變顏色。那么你可以在用戶懸停的時候添加類到元素中，反之則刪除類：

$('.btn').hover(function () {

$(this).addClass('hover');

}, function () {

$(this).removeClass('hover');

});

你只需要添加必要的CSS即可。更簡單的方法是使用toggleClass 方法：

$('.btn').hover(function () {

$(this).toggleClass('hover');

});

注：可能在這種情況下，CSS這種解決方案更快，不過了解這個方法很有必要。