jquery - 我怎样才能缩短这个jquery代码

Question

我正在尝试从在线教程中学习jquery。以下代码对我有用，但如何缩短和改进此代码？ this can be viewed on bottom of this page

$(document).ready(function() {
    $("#alltiles > div").mouseenter(function() {
        $(this).addClass("tile1");
        $(this).removeClass("tile");
        $('img', this).addClass("tileimg1");
        $('img', this).removeClass("tileimg");
        $('p', this).addClass("tilep1");
        $('p', this).removeClass("tilep");
    });
    $("#alltiles > div").mouseleave(function() {
        $(this).addClass("tile");
        $(this).removeClass("tile1");
        $('img', this).addClass("tileimg");
        $('img', this).removeClass("tileimg1");
        $('p', this).addClass("tilep");
        $('p', this).removeClass("tilep1");
    });
});

Answer 1

您可以使用toggleClass() 悬停时:

$(function() {
    $("#alltiles > div").hover(function() {
        $(this).toggleClass("tile","tile1");
        $('img', this).toggleClass("tileimg","tileimg1");
        $('p', this).toggleClass("tilep","tilep1");
    });
});