15个jQuery开发技巧与实践

1、给表格第三列的所有单元格添加一个名为 year 的类。

可使用 jQuery 实现，代码示例如下：

$('table td:nth-child(3)').addClass('year');

此代码会选中表格中每一行的第三个单元格并添加 year 类。

2、给第一个包含单词“Tragedy”的表格行添加“special”类。

可使用 jQuery 实现，代码示例如下：

$('tr:contains(Tragedy):first').addClass('special');

3、给任何 PDF 链接的最近祖先

• 元素添加类名 tragedy。

可使用以下 jQuery 代码实现：

$('a[href$=".pdf"]').closest('ul').addClass('tragedy');

4、当章节标题（

）被双击时，切换章节文本的可见性。假设章节文本的 HTML 结构为

，并且有一个 ‘hidden’ 类用于隐藏元素。

可以使用 jQuery 的 .dblclick() 方法结合 .toggleClass() 方法来实现。示例代码如下：

$(() => {
  $('h3.chapter-title')
    .dblclick(function() {
      $(this).next('.chapter-text').toggleClass('hidden');
    });
});

5、修改样式表，使页面内容最初隐藏。当页面加载时，缓慢淡入内容。

可在样式表中设置页面内容元素的 display 属性为 none 来隐藏内容，在 jQuery 中使用 $(document).ready() 函数，当页面加载完成后，对页面内容元素使用 .fadeIn('slow') 方法实现缓慢淡入效果。示例代码如下：

在样式表中：

body * {
  display: none;
}

在 JavaScript 中：

$(document).ready(function() {
  $('body *').fadeIn