Javascript wordpress中使用Ajax生成和更新div块的问题

我面临一个问题，生成和更新一个叫做短代码的wordpress插件中的一些块。 该插件的目的是显示python脚本生成的一些信息。 为了进行一些尝试，我简化了python脚本，只返回json中的日期和时间

{'heure'：time，'date'：date}

这部分工作得很好，但我的问题是从处理AJAX部分开始的：

.js文件：

//run the script after the page was loaded
jQuery(document).ready(runPyScript);

//run the script is Refresh button is clicked
jQuery("#Refresh").click(runPyScript);

//run the script every 10 seconds
setInterval(runPyScript,10000);


function runPyScript(){
    jQuery.ajax({
        method: 'post',
        url: ajax_object.ajaxurl,
        data: {
            'action': 'execute_python_with_argv2',
        }
    }).done(function(response) {
        console.log(response);
        //response contain the return of the python script and the <div> blocks created in function generate_html() of php...
        //to catch data between {} 
        dataX1 =response.substring(response.lastIndexOf("{"),response.lastIndexOf("}") + 1);
        
        dataX = JSON.parse(dataX1);
        jQuery("#DateX").html(dataX['date']);
        jQuery("#HeureX").html(dataX['heure']);
    });
};

//加载页面后运行脚本
jQuery（document）.ready（runPyScript）；
//单击“刷新”按钮后运行脚本
jQuery（“#刷新”）。单击（runPyScript）；
//每10秒运行一次脚本
setInterval（runPyScript，10000）；
函数runPyScript（）{
jQuery.ajax({
方法：“post”，
url:ajax_object.ajaxurl，
数据：{
'action'：'execute_python_with_argv2'，
}
}).完成（功能（响应）{
控制台日志（响应）；
//响应包含python脚本的返回和在php的函数generate_html（）中创建的块。。。
//捕获{}之间的数据
dataX1=response.substring（response.lastIndexOf（“{”）、response.lastIndexOf（“}”）+1）；
dataX=JSON.parse（dataX1）；
jQuery（“#DateX”）.html（dataX['date']）；
jQuery（“#HeureX”）.html（dataX['heure']）；
});
};

.php文件：

<?php
 add_shortcode( 'execute_python2', 'execute_python_with_argv2' );


 add_action('wp_enqueue_scripts', 'callback_for_script');
 function callback_for_script() {
    //Load style.css file located on /var/www/html/wp-content/plugins
     wp_deregister_script('jquery');
     wp_register_script( 'jquery', 'https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js');
     wp_enqueue_script('jquery');
     wp_enqueue_script( 'ajax-script', plugins_url( 'python2.js', __FILE__ ), array('jquery'),$ver='5.5.4' );
     wp_localize_script( 'ajax-script', 'ajax_object',array( 'ajaxurl' => admin_url('admin-ajax.php')));
  }


add_action( 'init_plug', 'generate_html');
add_action( 'wp_ajax_execute_python_with_argv2', 'execute_python_with_argv2' );


function generate_html(){
        ?>
        <div class='wrap'>
            <button id='Refresh' type='button' onclick="runPyScript()">Update</button>
            <div id='DateX'>XXX</div>
            <div id='HeureX'>XXX</div>
        </div> <?php

}

 function execute_python_with_argv2( $attributes){

 //run python script which return in $print_result a string {'heure':heure,'date':date}

    echo $print_result;
    do_action( 'init_plug');

 }
 ?>

更新
XXX
XXX

它几乎可以工作了，除了我被迫回显$print_结果（并显示）。。。 由generate_html（）生成的块在响应中

我用json_encode（）尝试了很多方法在没有回声的情况下管理它，但我没有做到

我还尝试使用wp_send_json_success（$print_result），它排除了响应中的块，但问题是我根本无法在页面中显示

有人能解释我做错了什么，以及如何解决这个问题吗？ 谢谢。

您不能将JSON和HTML代码作为同一响应的单独部分发送，然后期望接收者仍能将其理解为JSON。如果您需要在JSON响应内将HTML代码从服务器发送回您的客户机，那么您需要将该HTML代码放入JSON数据结构中，而不是单独输出。