在一个WEB应用程序中，前端页面通常与后端的PHP代码进行数据交互。在这种情况下，可以使用JavaScript来获取从服务器传递回来的数据。在网页上，JavaScript可以使用XMLHttpRequest对象来取回PHP发送的数据。下面是一个简单的实例，演示了如何使用JavaScript 和 PHP在网页上进行数据交互：
1. JavaScript示例代码：
```javascript
var xmlhttp;
if (window.XMLHttpRequest)
xmlhttp=new XMLHttpRequest();
else
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","somepage.php",true);
xmlhttp.send();
在JavaScript的xmlhttp对象中，我们使用了XMLHttpRequest()方法以创建了一个XMLHttpRequest对象。该对象在页面刷新之前不需要reload，因此可以用来获取从服务器发送回来的数据。这个函数作用的核心是readyState和status。readyState: 用来获取Ajax获取数据的状态。0表示未初始化，1表示正在加载，2表示加载完成，3表示交互中，4表示完成。status: 代表http返回的响应结果。 2xx表示成功，3xx表示重定向，4xx表示请求错误，5xx表示服务器错误。
2. PHP示例代码：
```php
<?php
$myValue = $_POST["myValue"];
echo $myValue;
?>
在本例中，PHP接收了一个名为“myValue”的POST数据。它然后将这个值做出响应通过echo命令，将这个值传回客户端。
在上述示例中，通过HTTP GET 方法使用XMLHttpRequest对象从服务器取回了PHP脚本输出的值，当然你也可以使用POST方法。你也可以使用其他方式来传递数据，例如使用FormData对象或者contentType及dataType等形式加以区分。不过总的来说，尽管方法或数据形式有不同，我的核心思想都是一样的：JavaScript可以直观地获取PHP传递的数据，这对于编写WEB应用程序和其他内容生成工具非常有用。
在前端（JavaScript）获取 PHP 传递的值，需要使用 AJAX 技术。 AJAX 是一种异步的 JavaScript 技术，能够在不刷新页面的前提下向服务器端发送请求并获取响应结果，从而实现局部刷新或数据交互的功能。
以下是一个简单的示例，展示了如何使用 AJAX 在前端获取 PHP 传递的值：
PHP 代码：
```php
<?php
$name = $_POST['name'];
echo $name;
?>
JavaScript 代码：
```javascript
let name = 'John';
let xhr = new XMLHttpRequest(); // 创建一个 XMLHttpRequest 对象
xhr.onreadystatechange = function () { // 绑定状态变化的回调函数
if (xhr.readyState === 4 && xhr.status === 200) { // 判断响应是否成功
let response = xhr.responseText; // 获取服务器端返回的响应结果
console.log(response); // 输出获取到的结果
}
}
xhr.open('POST', 'test.php', true); // 打开请求链接，并且为异步请求
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); // 设置请求头部
xhr.send('name=' + name); // 发送请求数据
以上代码执行的流程如下：
1. 实例化一个 XMLHttpRequest 对象。
2. 绑定一个状态变化的回调函数，当 XMLHttpRequest 对象的 readyState 属性变为 4（请求完成）且 status 属性为 200（成功），即得到了服务器端的响应结果时，执行该回调函数。
3. 设置请求头部，这里是设置 content-type 为表单提交的 application/x-www-form-urlencoded。
4. 调用 XMLHttpRequest 对象的 send 方法，发送请求数据（这里的请求数据是 name 字段为 John）。
在 PHP 中获取 AJAX 的请求数据，可以通过 $_POST 或 $_GET 全局数组来获取请求参数。
注意事项：
1. 请求方式要一致（GET 或 POST）。
2. 请求链接要正确。
3. 请求头部的 content-type 要与后端接收数据的方式一致。
发表评论