如何将变量和数据从 PHP 传递到 JavaScript?
P粉369196603
2023-08-27 12:05:35
<p>我在 PHP 中有一个变量,我在 JavaScript 代码中需要它的值。如何将我的变量从 PHP 转换为 JavaScript?</p>
<p>我的代码如下所示:</p>
<pre class="brush:php;toolbar:false;"><?php
$val = $myService->getValue(); // Makes an API and database call
</pre>
<p>在同一页面上,我有 JavaScript 代码,需要将 <code>$val</code> 变量的值作为参数传递:</p>
<pre class="brush:js;toolbar:false;"><script>
myPlugin.start($val); // I tried this, but it didn't work
<?php myPlugin.start($val); ?> // This didn't work either
myPlugin.start(<?=$val?>); // This works sometimes, but sometimes it fails
</script>
</pre>
<p><br /></p>
我通常在 HTML 中使用 data-* 属性。
此示例使用 jQuery,但它可以适用于其他库或普通 JavaScript。
您可以在此处阅读有关数据集属性的更多信息:https: //developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset
实际上有几种方法可以做到这一点。有些需要比其他更多的开销,有些被认为比其他更好。
排名不分先后:
在这篇文章中,我们将研究上述每种方法,了解每种方法的优缺点,以及如何实现它们。
1。使用AJAX从服务器获取您需要的数据
此方法被认为是最好的,因为您的服务器端和客户端脚本是完全分开的。
优点
缺点
实现示例
使用 AJAX,您需要两个页面,一个是 PHP 生成输出的页面,第二个是 JavaScript 获取该输出的页面:
获取数据.php
index.php(或任何实际页面的名称)
以上两个文件的组合将在文件加载完成时发出警报
42
。更多阅读材料
2。将数据回显到页面某处,并使用 JavaScript 从 DOM 获取信息
这种方法不如 AJAX 好,但它仍然有其优点。 PHP 和 JavaScript 之间仍然相对分开,从某种意义上说,JavaScript 中没有直接的 PHP。
优点
缺点
来存储信息,因为获取信息更容易超出
inputNode.value
,但这样做意味着 HTML 中存在无意义的元素。 HTML 具有用于表示有关文档的数据的元素,并且 HTML 5 引入了
data-*
属性,用于专门用于使用可与特定元素关联的 JavaScript 读取的数据。实现示例
这样,我们的想法是创建某种不会向用户显示但对 JavaScript 可见的元素。
index.php
3。将数据直接回显到 JavaScript
这可能是最容易理解的。
优点
缺点
实现示例
实现相对简单:
祝你好运!