Drupal 与 jQuery。第2课：选择器与效果

额外区块类型 (EBT) - 全新的布局构建器体验❗

额外区块类型 (EBT) - 样式化、可定制的区块类型：幻灯片、标签页、卡片、手风琴等更多类型。内置背景、DOM Box、JavaScript 插件的设置。立即体验布局构建的未来。

GLightbox is a pure javascript lightbox (Colorbox alternative without jQuery)❗

It can display images, iframes, inline content and videos with optional autoplay for YouTube, Vimeo and even self-hosted videos.

10/10/2025, by Ivan

在本课中，我们将学习 jQuery 的选择器与效果（effects）。

选择器

在选择器中，我们最常使用的是类选择器和 ID 选择器。jQuery 的选择器通常与 CSS 中的选择器类似，因此如果你会写 CSS 选择器，那么你也会写 jQuery 选择器。下面是选择类的方式：

$('.class')

而选择 ID 的方式如下：

$('#id')

在 jQuery 中有许多视觉效果可用：hide()/show()（隐藏或显示元素）、slideUp()/slideDown()（上下滑动隐藏或显示元素，可以选择方向）、fadeOut()/fadeIn()（通过改变透明度实现渐隐渐现效果）。

$('.class').hide(1000);

$('.class').fadeOut(1000);

$('.class').slideUp(1000);

在本课中我们还使用了 setTimeout 函数。这是 JavaScript 的一个函数，用于延迟执行代码：

setTimeout(function(){

// 这里写需要延迟执行的代码

}, 1000);

setTimeout 的第一个参数是一个函数，你可以在其中写入需要延迟执行的代码；第二个参数表示延迟的时间（以毫秒为单位）。