事件机制、DOM操作、jquery对尺寸操作、jquery添加和删除

// 假设我们有一个按钮和一个div元素
// HTML
<button id="toggle-btn">Toggle</button>
<div id="content">Hello, World!</div>
 
// 使用jQuery处理点击事件，切换div的显示与隐藏
$('#toggle-btn').on('click', function() {
    $('#content').toggle();
});
 
// 使用jQuery动态改变元素的宽度和高度
$('#content').css({
    width: '200px',
    height: '100px'
});
 
// 使用jQuery添加和删除类
$('#content').addClass('active'); // 添加类
$('#content').removeClass('active'); // 删除类
 
// 使用jQuery动态添加和删除属性
$('#content').attr('title', 'This is a content div'); // 添加title属性
$('#content').removeAttr('title'); // 删除title属性

这段代码展示了如何使用jQuery来处理事件，操作DOM元素的属性、类和尺寸。toggle()方法用于切换元素的可见状态，css()方法用于直接在选定的元素上设置样式，addClass()和removeClass()用于动态地添加或删除CSS类，而attr()和removeAttr()用于设置或移除HTML属性。