How to Pass Values from PHP to JavaScript

In PHP and JavaScript interaction, values need to be passed to achieve data exchange and cross‑language communication. The following methods show how to transfer values from PHP to JS.

1. Use echo to output a variable

$value = 'Hello JS';
echo "<script>var jsValue = '$value';</script>";

This outputs a script block in the HTML that assigns the JavaScript variable jsValue the value Hello JS.

2. Use json_encode function

$data = array('name' => 'John', 'age' => 30);
$json = json_encode($data);
echo "<script>var jsData = $json;</script>";

The json_encode function converts a PHP array or object to a JSON string, which can then be assigned to a JavaScript object.

3. Use header function

header("X-JS-Data: " . json_encode($data));

This adds a custom HTTP response header; JavaScript can retrieve the header value via an XMLHttpRequest.

4. Use an external JavaScript file

Include an external script and pass the value through a data attribute.

<script src="script.js" data-value="<?php echo $value; ?>"></script>

In script.js:

var value = document.querySelector('script[data-value]').getAttribute('data-value');

Choosing the appropriate method

The choice depends on the specific requirements and technical constraints of the application:

For simple strings or numbers, the echo method is convenient.

For complex data structures such as arrays or objects, json_encode to JSON is more suitable.

When cross‑origin communication is needed, the header method can embed data in HTTP requests.

The external JavaScript file method is useful when the value must be reused across multiple pages or applications.