使用jQuery实现点击打开收缩

很多网页都需要实现打开和收缩的功能，比如展开菜单、折叠面板等。使用jQuery可以非常方便地实现这种交互效果。

示例代码如下：

// HTML代码
<div id="expand">
   <p>这是要展开和收缩的内容。</p>
   <p>可以添加多个p标签，继续展示内容。</p>
</div>
<button id="toggle">点击展开/收缩</button>

// CSS代码
#expand {
   display: none;
 }

// jQuery代码
$('#toggle').click(function(){
   $('#expand').toggle('slow');
});

上面的代码中，首先将要展开和收缩的内容包裹在一个id为"expand"的div元素中，并设置其display属性为none，让其默认不显示。然后，添加一个元素用来触发展开和收缩的操作。

在jQuery的代码中，使用了toggle()方法来实现展开和收缩的效果，同时还可以指定展开或收缩的速度，这里设为'slow'，即比较缓慢。

通过上述代码，就可以实现简单的点击打开和收缩效果。