WordPress wp_get_recent_posts（）;如何使它成为AJAX

Question

我有一个使用wp_get_recent_posts()制作的程序，正在使用WordPress。

我想让它成为AJAX，因此页面工作得更快。我不知道从哪里开始以及如何使其发挥作用。

我现在正在使用的代码：

<?php
                    $args = array( 'numberposts' => '30', 'post_status' =>'publish');
                    $recent_posts = wp_get_recent_posts( $args );
                    $count = 0;

                    foreach( $recent_posts as $recent ){
                        $count ++;
                        $post_thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $recent["ID"] ), 'loadmore' );
                        $cats = get_the_category($recent["ID"]);
                        $cat_name = $cats[0]->name;
                        echo '
                            <ul class="col-md-12 col-sm-12 col-xs-12 post" style="padding-top: 20px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px;">';

                                if(($count%2) == 1) {
                                    echo '<div class="col-md-5 col-sm-5 col-xs-12">
                                    <a href="' . get_permalink($recent["ID"]) . '" title="'.esc_attr($recent[" post_title "]).'">
                                    <img src="' . esc_url( $post_thumbnail[0] ) . '" class="post-image" style="float:left; margin-bottom: 20px; height: auto;"></a>
                                </div>


                                <div class="col-md-7 col-sm-7 col-xs-12">
                                <center>
                                <p class="loadmoretitle" style="color:#ccc; font-size: 14px; font-weight: 600;">'. $cat_name .'</p>
                                <a class="loadmoretitle" href="' . get_permalink($recent["ID"]) . '" style="color:#000; font-size: 22px; font-weight: 800;">' . $recent["post_title"] .'</a>
                                </br>
                                <p class="dateload" style="margin-top: 5px; color: #ccc; margin-bottom: 25px;"><i class="fa fa-calendar" style="padding-right: 5px;"></i>' . date("Y m d", strtotime($recent[post_date])) . '</p>
                                <p style="margin-top: 10px; color: #444; padding-bottom: 25px; border-bottom: 1px solid #ccc;">' .  wp_trim_words( $recent['post_excerpt'], 80) . '</p>
                                    <a href="' . get_permalink($recent["ID"]) . '" title="Skaityti daugiau" class="blog-post-button">' . "SKAITYTI DAUGIAU" . '
                                    </a>
                                </center>
                                </div>';
                                }
                                else {
                                    echo '<div class="col-md-7 col-sm-7 col-xs-12">
                                    <center>
                                    <p class="loadmoretitle" style="color:#ccc; font-size: 14px; font-weight: 600;">'. $cat_name .'</p>
                                    <a class="loadmoretitle" href="' . get_permalink($recent["ID"]) . '" style="color:#000; font-size: 22px; font-weight: 800;">' . $recent["post_title"] .'</a>
                                    </br>
                                    <p class="dateload" style="margin-top: 5px; color: #ccc; margin-bottom: 25px;"><i class="fa fa-calendar" style="padding-right: 5px;"></i>' . date("Y m d", strtotime($recent[post_date])) . '</p>
                                    <p style="margin-top: 10px; color: #444; padding-bottom: 25px; border-bottom: 1px solid #ccc;">' .  wp_trim_words( $recent['post_excerpt'], 80) . '</p>
                                        <a href="' . get_permalink($recent["ID"]) . '" title="Skaityti daugiau" class="blog-post-button">' . "SKAITYTI DAUGIAU" . '
                                        </a>
                                    </center>
                                    </div>
                                    <div class="col-md-5 col-sm-5 col-xs-12">
                                        <a href="' . get_permalink($recent["ID"]) . '" title="'.esc_attr($recent[" post_title "]).'">
                                        <img src="' . esc_url( $post_thumbnail[0] ) . '" class="post-image" style="float:left; margin-bottom: 20px; height: auto;"></a>
                                    </div>';
                                }
                                ?>
                            </ul><?php
                    }
                ?>