使用 jQuery 选择器获取页面元素，然后利用 jQuery 对象的 css() 方法设置其 display 样式属性，从而实现显示和隐藏效果

[](()需求说明：

1. 使用 jQuery 选择器获取页面元素，然后利用 jQuery 对象的 css() 方法设置其 display 样式属性，从而实现显示和隐藏效果。

2. 具体要求如下：

• 在页面中显示电影排行榜

• 当单击“（收起）”链接时，排行榜中后三项的电影名称隐藏而且链接的文本更改为“（展开）

• ” 当单击“（展开）”的链接时，后三项的电影名称重新显示且链接的文本更改为“（收起）”


实现思路：

1. 新建 HTML 页面，使用

   和

   • 等标签制作页面加载时的初始效果

2. 在页面加载完毕事件中，给 （收起） 标签的单击事件绑定方法

3. 在 标签的点击事件方法中判断无序列表的后三项是否可见。若可见，利用 css() 方法把后三项的display 属性设置成“none”，再利用 text() 方法，改变 标签的文本为“展开”；若不可见，利用 css() 方法把后三项的 display 属性设置成“list-item”，再利用 text() 方法，改变 标签的文本为“收起”

实现代码：