本文介紹如何在WordPress中將php獲取的文章標題傳遞給JavaScript，并用于接口請求。 這對于需要在前端動態處理WordPress文章數據的情況非常實用。
我們目標是在頁面中獲取所有文章標題，并將它們作為參數傳遞給ajax請求，從而調用外部接口。
步驟一：PHP端獲取文章標題
首先，使用WP_Query類獲取所有文章標題，并將其存儲在一個PHP數組中：
立即學習“PHP免費學習筆記（深入）”；
$titles = array(); $args = array( 'post_type' => 'post', 'posts_per_page' => -1, // 獲取所有文章 ); $query = new WP_Query($args); if ($query->have_posts()) { while ($query->have_posts()) { $query->the_post(); $titles[] = get_the_title(); } wp_reset_postdata(); }
步驟二：將PHP數據傳遞給JavaScript
利用wp_enqueue_script和wp_localize_script函數將PHP數組$titles傳遞給JavaScript：
wp_enqueue_script('my_script', get_template_directory_uri() . '/JS/my_script.js', array('jquery'), '1.0', true); wp_localize_script('my_script', 'my_ajax_data', array( 'titles' => $titles, ));
這將創建一個名為my_ajax_data的JavaScript對象，其中包含titles數組。
步驟三：JavaScript端處理數據和發送Ajax請求
在my_script.js文件中，使用my_ajax_data.titles訪問文章標題數組，并使用jQuery的$.ajax()方法發送Ajax請求：
jQuery(document).ready(function($) { $.each(my_ajax_data.titles, function(index, title) { $.ajax({ type: 'GET', url: '你的接口地址', // 替換為你的接口地址 data: { title: title }, success: function(response) { console.log(response); // 處理接口返回的數據 }, error: function(error) { console.error('Ajax請求失敗:', error); } }); }); });
記住將’你的接口地址’替換成你的實際接口地址。 這個代碼片段會遍歷titles數組，對每個文章標題發送一個Ajax請求。
通過以上步驟，即可實現將WordPress文章標題從PHP傳遞到JavaScript，并用于外部接口請求，從而實現更動態和交互性的WordPress網站功能。 請確保你的主題已正確加載jQuery庫。
? 版權聲明
文章版權歸作者所有，未經允許請勿轉載。
THE END
