1️⃣ 使用 CSS position: sticky​

现代浏览器都支持 position: sticky，基本用法：

.docs-sidebar {
    position: sticky;
    top: 20px; /* 距离顶部 20px */
}

解释：​

• position: sticky;：当滚动到这个元素时，会固定在父容器内
• top: 20px;：距离浏览器窗口顶部的距离
• 重要：父容器不能有 overflow: hidden 或 overflow: auto，否则 sticky 失效

WordPress 核心已经自带了 jQuery，您不需要在子主题中专门 enqueue jQuery。

JQuery减轻心智负担，更容易阅读和理解代码.

对很多开发者来说，jQuery的代码更容易阅读和理解。这里有几个原因：

1. jQuery语法更直观

   • $('.class') vs document.querySelector('.class')
   • $(element).hide() vs element.style.display = 'none'

2. 链式操作更优雅

   // jQuery
   $('.element').hide().addClass('hidden').text('新内容');
   
   // 原生JS
   const element = document.querySelector('.element');
   element.style.display = 'none';
   element.classList.add('hidden');
   element.textContent = '新内容';