在 WordPress 中实现无刷新随机文章加载功能

在 wordpress 中实现无刷新随机文章加载功能

要在 wordPress 页面中点击按钮即动态加载一篇新随机文章，而无需整页刷新，最简洁高效的方式是利用 jquery 的 .load() 方法配合当前页面的局部重载能力——这避免了传统 ajax 所需的 php 动作钩子（wp_ajax_）、 nonce 验证和 jsON 响应处理等复杂流程。

✅ 实现原理

jQuery 的 $(“#randompost”).load(url + ” #randompost”) 会向当前页面 URL 发起 GET 请求，仅提取响应 HTML 中 #randompost 容器内的内容，并替换当前 DOM 中同 ID 元素的内容。由于 WordPress 每次加载该页面时都会执行一次 WP_Query(…’orderby’=>’rand’…)，因此只要将随机文章输出包裹在

内，重复加载该页面片段即可天然获得新随机结果。

✅ 完整实现步骤

1. 确保 jQuery 已加载（wordpress 主题通常已引入；若未启用，可在 functions.php 中添加或在模板底部手动引入）：

2. 在模板中正确组织 html 结构与 PHP 查询：

      'post',      'post_status'    => 'publish',      'posts_per_page' => 1,      'orderby'        => 'rand',      'no_found_rows'  => true, // 提升性能：禁用分页计数  );  $random_query = new WP_Query($args);  if ($random_query->have_posts()) :      while ($random_query->have_posts()) : $random_query->the_post();          ?>          
             
             暂无可用文章。
   ';  endif;  ?> 

? 换一篇 “`

3. 添加轻量级 JS 交互逻辑（建议置于