实际上有几种方法可以做到这一点。有些方法需要比其他方法更多的开销，有些方法被认为比其他方法更好

无特定顺序：

1. 使用AJAX从服务器获取所需的数据
2. 将数据回送到页面的某个位置，并使用JavaScript从DOM获取信息
3. 将数据直接回显到JavaScript

在这篇文章中，我们将研究上述每种方法，并了解每种方法的优缺点，以及如何实现它们

1.使用AJAX从服务器获取所需的数据

这种方法被认为是最好的，因为服务器端脚本和客户端脚本是完全分开的

专业人士

• 更好的层间分离-如果明天您停止使用PHP，并希望使用servlet、REST API或其他服务，则无需对JavaScript代码进行太多更改
• 更具可读性-JavaScript是JavaScript，PHP是PHP。如果不混合这两种语言，您可以在两种语言上获得更具可读性的代码
• 允许异步数据传输-从PHP获取信息可能需要花费大量的时间/资源。有时，您不想等待信息，加载页面，让信息随时到达
• 数据不能直接在标记上找到——这意味着标记没有任何附加数据，只有JavaScript可以看到

缺点

• 延迟-AJAX创建一个HTTP请求，HTTP请求通过网络传输，并具有网络延迟
• 状态-通过单独的HTTP请求获取的数据将不包括获取HTML文档的HTTP请求中的任何信息。您可能需要这些信息（例如，如果HTML文档是响应表单提交而生成的）如果你这样做了，就必须以某种方式进行传输。如果你已经排除了在页面中嵌入数据的可能性（如果你使用这种技术的话，你就有了这种可能性），那么这就限制了你使用cookie/会话，而这些cookie/会话可能会受到竞争条件的影响

实现示例

使用AJAX，您需要两个页面，一个是PHP生成输出的页面，另一个是JavaScript获取输出的页面：

get-data.php

/*在这里执行一些操作，例如与数据库对话、文件会话
*远处的世界，地狱，闪闪发光的城市，还有加拿大。
*
*AJAX通常使用字符串，但也可以输出JSON、HTML和XML。
*这完全取决于AJAX发送的内容类型头
*请求*/
echo json_encode（42）；//最后，您需要echo结果。
//所有数据都应该是json\u encode（）d。
//您可以使用PHP、数组、字符串、，
//甚至是物体。

php（或实际页面的名称）

&lt；！--snip--&gt；
&lt；脚本&gt；
函数reqListener（）{
console.log（this.responseText）；
}
var oReq=new XMLHttpRequest（）；//新请求对象
oReq.onload=函数（）{
//这是处理如何处理响应的地方。
//实际数据可在此.responseText上找到
警报（this.responseText）；//将发出警报：42
};
open（“get”，“get data.php”，true）；
//^不要阻止其余的执行。
//不要等到请求完成后才开始
//继续。
oReq.send（）；
&lt；/script&gt；
&lt；！--snip--&gt；

当文件完成加载时，上述两个文件的组合将发出警报42

还要一些阅读材料吗

• 使用XMLHttpRequest-MDN
• XMLHttpRequest对象引用-MDN
• 如何从异步调用返回响应？

2.将数据回显到页面的某个位置，并使用JavaScript从DOM获取信息

这种方法不如AJAX好，但它仍然有它的优点。在某种意义上，它仍然是PHP和JavaScript之间相对独立的，JavaScript中没有直接的PHP

专业人士

• Fast-DOM操作通常很快，您可以相对快速地存储和访问大量数据

缺点

• 潜在的非语义标记-通常情况下，您使用某种类型的&lt；input type=hidden&gt；来存储信息，因为从inputNode.value中更容易获取信息，但这样做意味着您的HTML中有一个无意义的元素；element获取有关文档的数据，HTML 5为数据引入了data-*属性，这些属性专门用于使用JavaScript读取可与特定元素关联的数据
• 弄脏源代码-PHP生成的数据直接输出到HTML源代码，这意味着您得到的是一个更大、更不集中的HTML源代码
• 更难获取结构化数据-结构化数据必须是有效的HTML，否则您必须自己转义和转换字符串
• 将PHP与您的数据逻辑紧密结合起来——因为PHP用于表示，所以您无法将两者清晰地分开

实现示例

这样做的目的是创建某种元素，这些元素不会显示给用户，但对JavaScript是可见的

index.php

&lt；！--snip--&gt；
&lt；div id=“dom target”style=“display:none；“&gt；
&lt；？php
$output=“42”//再次执行一些操作，获取输出。
echo htmlspecialchars（$output）；/*您必须转义，因为结果
否则将不是有效的HTML*/
？&gt；
&lt；/div&gt；
&lt；脚本&gt；
var div=document.getElementById（“dom目标”）；
var myData=div.textContent；
&lt；/script&gt；
&lt；！--snip--&gt；

3.将数据直接回显到JavaScript

这可能是最容易理解的

专业人士

• 非常容易实现-实现这一点需要花费很少的时间，并且可以理解
• 不污染源代码-变量直接输出到JavaScript，因此DOM不受影响

缺点

• 将PHP与您的数据逻辑紧密结合起来——因为PHP用于表示，所以您无法将两者清晰地分开

实现示例

实施相对简单：

&lt；！--snip--&gt；
&lt；脚本&gt；
var data=&lt；？php echo json_encode（“42”，json_HEX_标记）；？&gt；//不要忘记额外的分号！
&lt；/script&gt；
&lt；！--snip--&gt；

祝你好运