本文介绍如何通过 jquery 的 `.load()` 方法，在不刷新页面的前提下，点击按钮即可动态加载并显示一篇随机 wordpress 文章，无需编写复杂 ajax 后端逻辑。

要实现在 WordPress 页面中“点击按钮即展示一篇全新随机文章”，最简洁可靠的方案并非从零手写 AJAX 请求与 PHP 处理函数，而是利用 jQuery 提供的 .load() 方法——它能直接向当前页面发起 GET 请求，并智能提取指定选择器内的 HTML 片段进行局部替换。

Lesishu SEO Guide

SEO全流程：诊断、页面优化、技术SEO、内容策略、外链建设；触发关键词包括SEO、搜索排名、网站优化、关键词、标题描述、结构化数据、Core Web Vitals、sitemap、robots.txt、SEO审计等。

下载

✅ 实现步骤（三步到位）

1. 确保 jQuery 已加载（WordPress 主题通常已内置，但需确认）
   若主题未加载 jQuery，可在 footer.php 或使用 wp_enqueue_script 添加：

   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

   ⚠️ 建议使用 wp_enqueue_script('jquery') 在主题 functions.php 中正确引入，避免版本冲突或重复加载。

2. 封装随机文章输出为可复用区块
   将你的 WP_Query 逻辑包裹在一个具有唯一 ID 的容器中（如

   ），并确保该区块仅包含纯 HTML 内容（标题、正文等），不混入 PHP 条件判断或 JS 脚本：

   <div id="randompost">
       <?php
       $args = array(
           'post_type'      => 'post',
           'post_status'    => 'publish',
           'posts_per_page' => 1,
           'orderby'        => 'rand',
       );
       $random_query = new WP_Query($args);
       if ($random_query->have_posts()) :
           while ($random_query->have_posts()) : $random_query->the_post();
       ?>
           <h2><?php the_title(); ?></h2>
           <div class="post-content"><?php the_content(); ?></div>
       <?php
           endwhile;
           wp_reset_postdata(); // 关键：重置全局 $post 对象
       endif;
       ?>
   </div>

3. 添加轻量级 jQuery 点击事件
   在页面底部（