如何跨文件在JavaScript中使用PHP脚本信息并复用变量？

没问题，你完全可以把PHP中的值传递到JavaScript变量里，并且在脚本标签外部使用它。不过你当前的代码有个关键错误：带有src属性的<script>标签里不能同时写内部JS代码——浏览器会优先加载src指向的外部文件，直接忽略标签里的代码，所以你现在的img变量根本没被定义。

下面给你两种正确的实现方式：

方式一：拆分脚本标签（最常用） #

把引入外部文件和定义全局变量的操作分成两个独立的<script>标签，确保变量被定义在全局作用域：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>LaWeaaa</title> <!-- 顺便修正你之前的title标签写法，属性格式错啦 -->
    <link rel="stylesheet" type="text/css" href="assets/css/login.css">
</head>
<body>
    <!-- 1. 先引入外部的pru.php文件（如果它是输出JS逻辑的话） -->
    <script type="text/javascript" src="pru.php"></script>
    
    <!-- 2. 单独用一个script标签定义全局变量 -->
    <script type="text/javascript">
        // 把PHP变量$imagenes赋值给全局的img变量
        // 安全提示：如果$imagenes包含特殊字符（单引号、换行等），用json_encode更稳妥
        var img = <?php echo json_encode($imagenes); ?>;
    </script>

    <!-- 现在在页面任何后续的脚本里都能访问img变量了 -->
    <script type="text/javascript">
        // 举个例子：在控制台打印变量
        console.log("PHP传来的内容：", img);
        // 或者在页面交互里使用
        document.querySelector("body").style.backgroundImage = `url(${img})`;
    </script>
</body>
</html>

方式二：直接在外部PHP文件中定义变量 #

如果pru.php的作用就是输出JS内容，那可以直接在这个文件里完成PHP到JS的变量传递：

<?php
// pru.php文件内容
$imagenes = "你的图片路径/内容";
?>
// 直接在PHP里输出JS变量定义
var img = <?php echo json_encode($imagenes); ?>;

// 这里还可以写其他JS逻辑
function showImage() {
    alert(img);
}

然后页面里只需要引入这个文件，就能直接使用img变量了：

<script type="text/javascript" src="pru.php"></script>
<script type="text/javascript">
    // 直接调用变量或相关函数
    showImage();
    console.log(img);
</script>

关键注意事项 #

• 一定要确保$imagenes被正确赋值，PHP代码要在服务器环境下运行（比如XAMPP、WAMP或者线上服务器），直接打开HTML文件的话PHP代码不会被解析。
• 用json_encode代替直接echo是更安全的做法，它会自动转义JS里的特殊字符（比如单引号、双引号、换行符），避免出现语法错误。

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