为何基于XMLHttpRequest的Ajax无法与PHP正常交互、未触发alert弹窗？

• 你代码里存在最直接的逻辑时序错误：回调函数绑定时机错误
  当前代码的执行顺序是：初始化XMLHttpRequest对象 → 配置open()请求参数 → 立刻调用send()发送请求 → 发送完成后才给onreadystatechange赋值回调函数。异步请求在调用send()之后就会立刻启动执行流程，很可能等你把回调函数绑定完成时，请求已经走完了全部readyState状态，回调根本不会被触发。
  正确的执行顺序必须是：初始化XHR对象 → 配置open()参数 → 先绑定onreadystatechange回调函数 → 最后调用send()发送请求。
• 新手最高发的环境类错误：直接用file://协议打开前端页面
  PHP是服务端解析语言，必须依托Web服务器（本地Apache、Nginx，或PHP自带内置服务）运行。如果直接双击打开前端HTML文件，地址栏开头为file://时，浏览器会拦截XHR对本地PHP文件的跨协议请求，根本不会正常发出请求。
  正确操作：把前后端文件全部放到Web服务器的站点目录下，通过http://localhost/前端页面路径这类HTTP地址访问页面；可以先直接在浏览器地址栏访问data.php，如果能看到输出的HelloWorld，说明PHP运行环境正常。
• 需核对的细节问题：
  • 代码里写的请求方法是"Get"，虽然XMLHttpRequest规范中请求方法名不区分大小写，但统一写为大写的"GET"更稳妥，避免部分旧浏览器的兼容问题
  • 核对url配置的路径是否正确：如果前端HTML和data.php不在同一文件路径下，相对路径写错会直接触发404，可按F12打开浏览器开发者工具，切到「网络」面板查看XHR请求的状态码，状态码为404即代表路径错误。
• 修正后可直接跑通的参考代码：

<script>
    const ajax = new XMLHttpRequest();
    const method = "GET";
    const url = "data.php";
    const asynch = true;

    // 配置请求参数
    ajax.open(method, url, asynch);
    // send之前完成回调绑定
    ajax.onreadystatechange = function () {
        if (this.readyState === 4 && this.status === 200) {
            alert(this.responseText);
        }
    }
    // 最后发送请求
    ajax.send();
</script>

快速排障技巧：如果修正后仍无反应，直接查看开发者工具控制台的红色报错、网络面板的请求实际返回内容，定位问题比逐行猜效率高很多。

内容的提问来源于stack exchange，提问作者pieDragon