// 选择所有类名为 'item' 的元素并隐藏
$('.item').hide();

// 选择 ID 为 'main' 的元素并显示
$('#main').show();

// 修改元素内容
$('#content').html('<p>新的内容</p>');

// 修改元素属性
$('img').attr('src', 'new-image.jpg');

// 点击事件
$('#button').click(function() {
    alert('按钮被点击了!');
});

// 鼠标悬停事件
$('.hover-item').hover(
    function() { $(this).addClass('highlight'); }, // 鼠标进入
    function() { $(this).removeClass('highlight'); } // 鼠标离开
);

// 表单提交事件
$('#myForm').submit(function(e) {
    e.preventDefault(); // 阻止默认提交行为
    // 处理表单数据
});

// 淡入淡出
$('#box').fadeIn(1000); // 1秒淡入
$('#box').fadeOut(500); // 0.5秒淡出

// 滑动效果
$('#panel').slideUp(); // 向上滑动隐藏
$('#panel').slideDown(); // 向下滑动显示

// 自定义动画
$('#animate-me').animate({
    left: '250px',
    opacity: '0.5',
    height: '150px'
}, 1000);

// GET 请求
$.get('api/data', function(data) {
    console.log('获取到的数据:', data);
});

// POST 请求
$.post('api/save', { name: 'John', age: 30 }, function(response) {
    console.log('服务器响应:', response);
});

// 完整的 AJAX 请求
$.ajax({
    url: 'api/data',
    type: 'GET',
    dataType: 'json',
    success: function(data) {
        console.log('成功:', data);
    },
    error: function(xhr, status, error) {
        console.log('错误:', error);
    }
});

// 创建新元素
var newDiv = $('<div>', {
    id: 'new-div',
    class: 'box',
    text: '我是新创建的div'
});

// 添加元素
$('#container').append(newDiv); // 添加到末尾
$('#container').prepend(newDiv); // 添加到开头

// 删除元素
$('#old-div').remove();

// 克隆元素
var clonedElement = $('#template').clone();

// 遍历元素
$('li').each(function(index) {
    console.log(index + ': ' + $(this).text());
});

// 检查元素是否存在
if ($('#myElement').length) {
    console.log('元素存在');
}

// 延迟执行
$('#button').click(function() {
    $(this).text('等待...');
    setTimeout(function() {
        $('#button').text('完成!');
    }, 2000);
});