如何用PHP生成JS变量并在页面中直接使用？-js教程-PHP中文网

如何用PHP生成JS变量并在页面中直接使用？

心靈之曲

发布： 2025-02-21 17:04:01

原创

369人浏览过

如何用php生成js变量并在页面中直接使用？

PHP生成JS变量并在页面中直接使用

本文介绍如何利用PHP生成JavaScript变量，并在页面中直接访问。

方法一：直接输出JS代码

PHP端 (例如：api.php)： 使用json_encode()函数将PHP数组转换为JSON格式的字符串，并将其赋值给一个JS变量。

<code class="php"><?php
$data = array(
    'list' => array(
        array('id' => 1, 'name' => '张三'),
        array('id' => 2, 'name' => '李四')
    )
);
echo "<script>var data = " . json_encode($data) . ";</script>";
?></code>

登录后复制

页面端： 直接在页面中引入api.php文件，JS变量data将自动被定义。

<code class="html"><!DOCTYPE html>
<html>
<head>
    <title>PHP生成JS变量</title>
</head>
<body>
    <?php include 'api.php'; ?>
    <script>
        document.write(data.list[0].name); // 输出 "张三"
    </script>
</body>
</html></code>

登录后复制

方法二：使用AJAX异步获取数据

立即学习“PHP免费学习笔记（深入）”；

AI封面生成器

专业的AI封面生成工具，支持小红书、公众号、小说、红包、视频封面等多种类型，一键生成高质量封面图片。

108

查看详情

此方法更适用于大型数据或需要动态更新的情况。

PHP端 (api.php)： 返回JSON数据。

<code class="php"><?php
header('Content-Type: application/json');
$data = array(
    'list' => array(
        array('id' => 1, 'name' => '张三'),
        array('id' => 2, 'name' => '李四')
    )
);
echo json_encode($data);
?></code>

登录后复制

页面端： 使用AJAX请求获取数据，并将数据赋值给JS变量。

<code class="html"><!DOCTYPE html>
<html>
<head>
    <title>PHP生成JS变量(AJAX)</title>
</head>
<body>
    <script>
        fetch('api.php')
            .then(response => response.json())
            .then(data => {
                document.write(data.list[0].name); // 输出 "张三"
            });
    </script>
</body>
</html></code>

登录后复制

错误排查：Uncaught ReferenceError: data is not defined

此错误通常是因为：